CODEWITHSUNDEEP
luacoronasdk
teapot7
teapot7

Reputation: 743

How can I control screen alignment in Corona when screen orientation changes?

I've set up my config.lua so that my content area is at the top of the screen, and have set the dimensions of the content area so that it just fills an iPhone4 screen, but leaves a gap at the bottom of an iPhone5 screen. 

application = 
{
    content = 
    {
        width = 640,
        height = 960,
        scale = "letterbox",
        xAlign = "center",
        yAlign = "top",     
    }
}

This is fine in portrait mode, but when the phone rotates to landscape, the content is now shown left aligned, rather than center aligned - as if Corona doesn't change its idea of what "xAlign" and "yAlign" mean when the screen rotates.

Is there any way I can programatically change the xAlign and yAlign values when the screen rotates? Or better yet, is there a configuration which will make Corona handle screen rotation and alignment more reasonably?

I know I can get the same effect I want by just moving the group I'm drawing into a bit to the right, but I'd like to find an answer which isn't a hack.

See below for a picture of what I'm talking about:

enter image description here

Here's the main.lua:

local myGroup

local function drawScreen()
    myGroup = display.newGroup( )

    local top = 0
    local left = 0
    local bottom = display.contentHeight
    local right = display.contentWidth

    local r2 = display.newRect( left, top, right, bottom )
    r2:setFillColor(0.4, 0.4, 0.4)
    r2.anchorX = 0
    r2.anchorY = 0
    myGroup:insert(r2)
end

local function clearScreen()
    if (myGroup ~= null) then
        myGroup:removeSelf()
    end
    myGroup = nil
end

local function onOrientationChange( event )
    clearScreen()
    drawScreen()
end

-- and we're running

Runtime:addEventListener( "orientation", onOrientationChange ) 

-- hide status bar
display.setStatusBar( display.HiddenStatusBar )

drawScreen()

Upvotes: 0

Views: 1332

Answers (1)

Fernker
Fernker

Reputation: 2288

Ok so I found a solution. It's really fun sometimes with Corona and the letterbox scaling.

In build.settings I made sure to have this set for orientation:

orientation = {
    default = "portrait",
    supported = { "portrait", "landscapeLeft", "landscapeRight"}
},

In the main file I changed to this: r2.anchorX = 0.5 and switched to local left = display.actualContentWidth/2

This seems to have done the trick. I could never get the xAlign or yAlign to do anything. I switched them but never saw results.

So I'd play around with what I posted. It can get really weird with the letter box. I don't know exactly why in landscape that box was pushing all the way to the left. There should have been equal black bars on both sides. But for some reason there wasn't. Let me know if this gets you on the right path.

Upvotes: 0

Related Questions