system.orientation - IOS override

Using system.orientation on IOS works as predicted if you just flip back and forth from portrait to landscape. But if you turn continuously the landscape mode does it’s own flip on the device.

I’m using a fixed orientation (default = “landscapeLeft”,) and then using the system.orientation event to allow me redraw my screen. It works just fine on simulator and on Android. But on IOS device when I go from landscapeLeft to portrait and then to landscapeRight, the device does a 180 turn. This then means that when I turn again to portraitupsidedown, the device has inverted the display and my code cannot override that (or detect it) so my screen is now upsidedown. This is despite having written code for portraitupsidedown. That code works fine if I go to that orientation without going through 180 turn first.

To explain further, please see this video.

https://www.dropbox.com/s/eitxe9z5wk57ojf/IMG_0432.MOV?dl=0

Hi @conor1,

More than likely, you’ll need to post the code pertaining to your “orientation” listener so the community/staff can see how you’re approaching that task. Please remember to surround your code with “lua” tags for clarity:

[lua] --code [/lua]

Thanks,

Brent

I’m using this

[lua]

local function onOrientationChange( event )

    currentOrientation = event.type

    if (currentOrientation==“portraitUpsideDown”) then

    – a block of code that turns various elements thru -90 rotation and sets new x,y

    elseif (currentOrientation==“portrait”) then

   – a block of code that turns various elements thru -90 rotation and sets new x,y

   – plus turn my entire container thru 180 rotation

   else

   – a block of code that resets all elements to 0 degs and original x,y

end

[/lua]

My build.setting has orientation set as default = “landscapeLeft”,

Hi @conor1,

Can you post the entire block from your build.settings that pertains to orientation?

Also, can you test this on the device with it laying face up on a table (and starting the app on that surface)? I want to confirm that you’re not getting “faceUp” and “faceDown” orientation signals on the iPad that might be messing up your overall orientation change.

Thanks,

Brent

if you lay an iPad flat on a table and rotate it, nothing happens, with any app.

I’m linking to a simplified version of my app with two images. Should help explain what’s going on.

https://www.dropbox.com/s/xp7jhfa8b2gbcqk/marina.zip?dl=0

Hi Conor,

I notice you’re missing the “supported” table within your “orientation” table. Is there a reason you omitted it?

Brent

I had dumped them because they didn’t seem to make a difference. Also, I saw a reference somewhere that suggested leaving them out in order to fully control the display.

Interesting, with supported= “landscapeLeft”, “landscapeRight”, 

I get my landscape mode wrong when I flip the ipad thru 180.

The issue I think is the IOS flip between both landscape modes which cannot be detected and effectively overrides the corona orientation code. This flip is not accounted for on Windows simulator,or Mac simulator.

For clarification, see this table, which shows what happens on devices and simulators when starting from landscapeleft and progress clockwise thru portraitUpsideDown, landscapeRight and portrait. No ‘supported’ devices, just default = “landscapeLeft” and switching orientation of resources in code.

  Mac Windows iPad Android LL OK OK OK OK PUD OK OK OK OK LR OK OK Autoflip/Bad OK P OK OK Bad OK

Hi @conor1,

I installed your app on my iPhone, and the issue seems to be your “else” condition. The orientation listener is still triggering “faceUp” and “faceDown” responses, even if the change in that physical orientation is subtle. Thus, you should not rely on an “else” case which is likely using those events to reconfigure the view, effectively throwing off your UI. I adjusted your code to ignore those two cases, and set the default “currentOrientation” variable to “landscapeLeft” (your default orientation), and it seems to work fine.

Brent

That doesn’t do it. There’s still the problem of the device deciding to rotate the display by 180deg. Here’s my modified code, added a field to show currentOrientation, and added currentOrientation=“landscapeLeft” to scene:create( event )

[lua]

local function onOrientationChange( event )

    currentOrientation = event.type

titleText.text=system.orientation

    if (currentOrientation==“portraitUpsideDown”) then

local rot=-1

topGroup.x=0

topGroup.y=screenHeight

topGroup.xScale=screenHeight/screenWidth

topGroup.yScale=screenHeight/screenWidth

topGroup.rotation=rot*90

chartGroup.x,chartGroup.y=450,650

chartGroup.rotation=rot*90

displayGroup.rotation=0

displayGroup.x,displayGroup.y=0,0

elseif (currentOrientation==“portrait”) then

local rot=-1

topGroup.x=0

topGroup.y=screenHeight

topGroup.xScale=screenHeight/screenWidth

topGroup.yScale=screenHeight/screenWidth

topGroup.rotation=rot*90

chartGroup.x,chartGroup.y=450,650

chartGroup.rotation=rot*90

displayGroup.rotation=180

displayGroup.x=screenWidth

displayGroup.y=screenHeight

elseif (currentOrientation==“landscapeRight”) then

topGroup.x,topGroup.y=0,0

topGroup.xScale=1

topGroup.yScale=1

topGroup.rotation=0

chartGroup.rotation=0

chartGroup.x,chartGroup.y=310,154

displayGroup.rotation=180

displayGroup.x,displayGroup.y=0,0

displayGroup.x=screenWidth

displayGroup.y=screenHeight

elseif (currentOrientation==“landscapeLeft”) then

topGroup.x,topGroup.y=0,0

topGroup.xScale=1

topGroup.yScale=1

topGroup.rotation=0

chartGroup.rotation=0

chartGroup.x,chartGroup.y=310,154

displayGroup.rotation=0

displayGroup.x,displayGroup.y=0,0

end

print (currentOrientation,displayGroup.rotation,displayGroup.x,displayGroup.y)

end

function scene:create( event )

screenGroup = self.view

topGroup=display.newGroup()

topmenu = display.newImageRect(“topmenu.png”,1024,105)

topmenu.anchorX = 0

topmenu.anchorY = 0

topmenu.x=0

topmenu.y=0

topmenu.touch = menuListener

topmenu:addEventListener( “touch”, topmenu )

topGroup:insert(topmenu)

local textOptions={parent=topGroup, text=“Royal Clarence Marina”,x=12,y=112,width=900,height=30,font=systemFontBold,fontSize=30}

titleText = display.newText(textOptions)

titleText:setFillColor(1,1,1)

titleText.anchorY = 0

titleText.anchorX = 0

titleText.xScale=1.2

chartGroup=display.newGroup()

chart = display.newImage(“marina.gif”)

chart.anchorX = 0

chart.anchorY = 0

chart.x=0

chart.y=0

chartGroup.x=310

chartGroup.y=154

chartGroup:insert(chart)

displayGroup=display.newGroup()

displayGroup:insert(topGroup)

displayGroup:insert(chartGroup)

screenGroup:insert(displayGroup)

currentOrientation=“landscapeLeft”

Runtime:addEventListener( “orientation”, onOrientationChange )

end

[/lua]

Hi again,

I’m not sure what is causing your issues, but I tested with the following code and I could never get the scene to rotate “wrong” on my iPhone 5. I also set the config to merely “landscapeLeft” is the “default” table in build.settings, and I omitted the “supported” table as you originally did too.

[lua]

local composer = require( “composer” )

local scene = composer.newScene()

composer.removeHidden() 

local widget = require(“widget”)

leftEdge,rightEdge,topEdge,bottomEdge,screenHeight,screenWidth=display.screenOriginX, display.contentWidth-display.screenOriginX, display.screenOriginY,display.contentHeight -display.screenOriginY,display.contentHeight-display.screenOriginY*2,display.contentWidth–display.screenOriginX*2

local currentOrientation = “landscapeLeft”

local function onOrientationChange( event )

  currentOrientation = event.type

  --titleText.text=system.orientation

  if (currentOrientation==“portraitUpsideDown”) then

    local rot=-1

    topGroup.x=0

    topGroup.y=screenHeight

    topGroup.xScale=screenHeight/screenWidth

    topGroup.yScale=screenHeight/screenWidth

    topGroup.rotation=rot*90

    chartGroup.x,chartGroup.y=450,650

    chartGroup.rotation=rot*90

    displayGroup.rotation=0

    displayGroup.x,displayGroup.y=0,0

  elseif (currentOrientation==“portrait”) then

    local rot=-1

    topGroup.x=0

    topGroup.y=screenHeight

    topGroup.xScale=screenHeight/screenWidth

    topGroup.yScale=screenHeight/screenWidth

    topGroup.rotation=rot*90

    chartGroup.x,chartGroup.y=450,650

    chartGroup.rotation=rot*90

    displayGroup.rotation=180

    displayGroup.x=screenWidth

    displayGroup.y=screenHeight

  elseif (currentOrientation==“landscapeRight”) then

    topGroup.x,topGroup.y=0,0

    topGroup.xScale=1

    topGroup.yScale=1

    topGroup.rotation=0

    chartGroup.rotation=0

    chartGroup.x,chartGroup.y=310,154

    displayGroup.rotation=180

    displayGroup.x,displayGroup.y=0,0

    displayGroup.x=screenWidth

    displayGroup.y=screenHeight

  elseif (currentOrientation==“landscapeLeft”) then

    topGroup.x,topGroup.y=0,0

    topGroup.xScale=1

    topGroup.yScale=1

    topGroup.rotation=0

    chartGroup.rotation=0

    chartGroup.x,chartGroup.y=310,154

    displayGroup.rotation=0

    displayGroup.x,displayGroup.y=0,0

  end

  print (currentOrientation,displayGroup.rotation,displayGroup.x,displayGroup.y)

end

function scene:create( event )

  screenGroup = self.view

  topGroup=display.newGroup()

  topmenu = display.newImageRect(“topmenu.png”,1024,105)

  topmenu.anchorX = 0

  topmenu.anchorY = 0

  topmenu.x=0

  topmenu.y=0

  topmenu.touch = menuListener

  topmenu:addEventListener( “touch”, topmenu )

  topGroup:insert(topmenu)

  chartGroup=display.newGroup()

  chart = display.newImage(“marina.gif”)

  chart.anchorX = 0

  chart.anchorY = 0

  chart.x=0

  chart.y=0

  chartGroup.x=310

  chartGroup.y=154

  chartGroup:insert(chart)

  displayGroup=display.newGroup()

  displayGroup:insert(topGroup)

  displayGroup:insert(chartGroup)

  screenGroup:insert(displayGroup)

  Runtime:addEventListener( “orientation”, onOrientationChange )

end

function scene:destroy( event )

  local sceneGroup = self.view

  display.remove(sceneGroup)

end


– END OF IMPLEMENTATION


– “createScene” event is dispatched if scene’s view does not exist

scene:addEventListener( “create”, scene )

scene:addEventListener( “destroy”, scene )

return scene

[/lua]

Brent,

Thanks for your help on this. Seems the issue is with corona viewer. Building on a remote mac and installing, the issue does not appear.

Hi @conor1,

More than likely, you’ll need to post the code pertaining to your “orientation” listener so the community/staff can see how you’re approaching that task. Please remember to surround your code with “lua” tags for clarity:

[lua] --code [/lua]

Thanks,

Brent

I’m using this

[lua]

local function onOrientationChange( event )

    currentOrientation = event.type

    if (currentOrientation==“portraitUpsideDown”) then

    – a block of code that turns various elements thru -90 rotation and sets new x,y

    elseif (currentOrientation==“portrait”) then

   – a block of code that turns various elements thru -90 rotation and sets new x,y

   – plus turn my entire container thru 180 rotation

   else

   – a block of code that resets all elements to 0 degs and original x,y

end

[/lua]

My build.setting has orientation set as default = “landscapeLeft”,

Hi @conor1,

Can you post the entire block from your build.settings that pertains to orientation?

Also, can you test this on the device with it laying face up on a table (and starting the app on that surface)? I want to confirm that you’re not getting “faceUp” and “faceDown” orientation signals on the iPad that might be messing up your overall orientation change.

Thanks,

Brent

if you lay an iPad flat on a table and rotate it, nothing happens, with any app.

I’m linking to a simplified version of my app with two images. Should help explain what’s going on.

https://www.dropbox.com/s/xp7jhfa8b2gbcqk/marina.zip?dl=0

Hi Conor,

I notice you’re missing the “supported” table within your “orientation” table. Is there a reason you omitted it?

Brent

I had dumped them because they didn’t seem to make a difference. Also, I saw a reference somewhere that suggested leaving them out in order to fully control the display.

Interesting, with supported= “landscapeLeft”, “landscapeRight”, 

I get my landscape mode wrong when I flip the ipad thru 180.

The issue I think is the IOS flip between both landscape modes which cannot be detected and effectively overrides the corona orientation code. This flip is not accounted for on Windows simulator,or Mac simulator.

For clarification, see this table, which shows what happens on devices and simulators when starting from landscapeleft and progress clockwise thru portraitUpsideDown, landscapeRight and portrait. No ‘supported’ devices, just default = “landscapeLeft” and switching orientation of resources in code.

  Mac Windows iPad Android LL OK OK OK OK PUD OK OK OK OK LR OK OK Autoflip/Bad OK P OK OK Bad OK

Hi @conor1,

I installed your app on my iPhone, and the issue seems to be your “else” condition. The orientation listener is still triggering “faceUp” and “faceDown” responses, even if the change in that physical orientation is subtle. Thus, you should not rely on an “else” case which is likely using those events to reconfigure the view, effectively throwing off your UI. I adjusted your code to ignore those two cases, and set the default “currentOrientation” variable to “landscapeLeft” (your default orientation), and it seems to work fine.

Brent

That doesn’t do it. There’s still the problem of the device deciding to rotate the display by 180deg. Here’s my modified code, added a field to show currentOrientation, and added currentOrientation=“landscapeLeft” to scene:create( event )

[lua]

local function onOrientationChange( event )

    currentOrientation = event.type

titleText.text=system.orientation

    if (currentOrientation==“portraitUpsideDown”) then

local rot=-1

topGroup.x=0

topGroup.y=screenHeight

topGroup.xScale=screenHeight/screenWidth

topGroup.yScale=screenHeight/screenWidth

topGroup.rotation=rot*90

chartGroup.x,chartGroup.y=450,650

chartGroup.rotation=rot*90

displayGroup.rotation=0

displayGroup.x,displayGroup.y=0,0

elseif (currentOrientation==“portrait”) then

local rot=-1

topGroup.x=0

topGroup.y=screenHeight

topGroup.xScale=screenHeight/screenWidth

topGroup.yScale=screenHeight/screenWidth

topGroup.rotation=rot*90

chartGroup.x,chartGroup.y=450,650

chartGroup.rotation=rot*90

displayGroup.rotation=180

displayGroup.x=screenWidth

displayGroup.y=screenHeight

elseif (currentOrientation==“landscapeRight”) then

topGroup.x,topGroup.y=0,0

topGroup.xScale=1

topGroup.yScale=1

topGroup.rotation=0

chartGroup.rotation=0

chartGroup.x,chartGroup.y=310,154

displayGroup.rotation=180

displayGroup.x,displayGroup.y=0,0

displayGroup.x=screenWidth

displayGroup.y=screenHeight

elseif (currentOrientation==“landscapeLeft”) then

topGroup.x,topGroup.y=0,0

topGroup.xScale=1

topGroup.yScale=1

topGroup.rotation=0

chartGroup.rotation=0

chartGroup.x,chartGroup.y=310,154

displayGroup.rotation=0

displayGroup.x,displayGroup.y=0,0

end

print (currentOrientation,displayGroup.rotation,displayGroup.x,displayGroup.y)

end

function scene:create( event )

screenGroup = self.view

topGroup=display.newGroup()

topmenu = display.newImageRect(“topmenu.png”,1024,105)

topmenu.anchorX = 0

topmenu.anchorY = 0

topmenu.x=0

topmenu.y=0

topmenu.touch = menuListener

topmenu:addEventListener( “touch”, topmenu )

topGroup:insert(topmenu)

local textOptions={parent=topGroup, text=“Royal Clarence Marina”,x=12,y=112,width=900,height=30,font=systemFontBold,fontSize=30}

titleText = display.newText(textOptions)

titleText:setFillColor(1,1,1)

titleText.anchorY = 0

titleText.anchorX = 0

titleText.xScale=1.2

chartGroup=display.newGroup()

chart = display.newImage(“marina.gif”)

chart.anchorX = 0

chart.anchorY = 0

chart.x=0

chart.y=0

chartGroup.x=310

chartGroup.y=154

chartGroup:insert(chart)

displayGroup=display.newGroup()

displayGroup:insert(topGroup)

displayGroup:insert(chartGroup)

screenGroup:insert(displayGroup)

currentOrientation=“landscapeLeft”

Runtime:addEventListener( “orientation”, onOrientationChange )

end

[/lua]

Hi again,

I’m not sure what is causing your issues, but I tested with the following code and I could never get the scene to rotate “wrong” on my iPhone 5. I also set the config to merely “landscapeLeft” is the “default” table in build.settings, and I omitted the “supported” table as you originally did too.

[lua]

local composer = require( “composer” )

local scene = composer.newScene()

composer.removeHidden() 

local widget = require(“widget”)

leftEdge,rightEdge,topEdge,bottomEdge,screenHeight,screenWidth=display.screenOriginX, display.contentWidth-display.screenOriginX, display.screenOriginY,display.contentHeight -display.screenOriginY,display.contentHeight-display.screenOriginY*2,display.contentWidth–display.screenOriginX*2

local currentOrientation = “landscapeLeft”

local function onOrientationChange( event )

  currentOrientation = event.type

  --titleText.text=system.orientation

  if (currentOrientation==“portraitUpsideDown”) then

    local rot=-1

    topGroup.x=0

    topGroup.y=screenHeight

    topGroup.xScale=screenHeight/screenWidth

    topGroup.yScale=screenHeight/screenWidth

    topGroup.rotation=rot*90

    chartGroup.x,chartGroup.y=450,650

    chartGroup.rotation=rot*90

    displayGroup.rotation=0

    displayGroup.x,displayGroup.y=0,0

  elseif (currentOrientation==“portrait”) then

    local rot=-1

    topGroup.x=0

    topGroup.y=screenHeight

    topGroup.xScale=screenHeight/screenWidth

    topGroup.yScale=screenHeight/screenWidth

    topGroup.rotation=rot*90

    chartGroup.x,chartGroup.y=450,650

    chartGroup.rotation=rot*90

    displayGroup.rotation=180

    displayGroup.x=screenWidth

    displayGroup.y=screenHeight

  elseif (currentOrientation==“landscapeRight”) then

    topGroup.x,topGroup.y=0,0

    topGroup.xScale=1

    topGroup.yScale=1

    topGroup.rotation=0

    chartGroup.rotation=0

    chartGroup.x,chartGroup.y=310,154

    displayGroup.rotation=180

    displayGroup.x,displayGroup.y=0,0

    displayGroup.x=screenWidth

    displayGroup.y=screenHeight

  elseif (currentOrientation==“landscapeLeft”) then

    topGroup.x,topGroup.y=0,0

    topGroup.xScale=1

    topGroup.yScale=1

    topGroup.rotation=0

    chartGroup.rotation=0

    chartGroup.x,chartGroup.y=310,154

    displayGroup.rotation=0

    displayGroup.x,displayGroup.y=0,0

  end

  print (currentOrientation,displayGroup.rotation,displayGroup.x,displayGroup.y)

end

function scene:create( event )

  screenGroup = self.view

  topGroup=display.newGroup()

  topmenu = display.newImageRect(“topmenu.png”,1024,105)

  topmenu.anchorX = 0

  topmenu.anchorY = 0

  topmenu.x=0

  topmenu.y=0

  topmenu.touch = menuListener

  topmenu:addEventListener( “touch”, topmenu )

  topGroup:insert(topmenu)

  chartGroup=display.newGroup()

  chart = display.newImage(“marina.gif”)

  chart.anchorX = 0

  chart.anchorY = 0

  chart.x=0

  chart.y=0

  chartGroup.x=310

  chartGroup.y=154

  chartGroup:insert(chart)

  displayGroup=display.newGroup()

  displayGroup:insert(topGroup)

  displayGroup:insert(chartGroup)

  screenGroup:insert(displayGroup)

  Runtime:addEventListener( “orientation”, onOrientationChange )

end

function scene:destroy( event )

  local sceneGroup = self.view

  display.remove(sceneGroup)

end


– END OF IMPLEMENTATION


– “createScene” event is dispatched if scene’s view does not exist

scene:addEventListener( “create”, scene )

scene:addEventListener( “destroy”, scene )

return scene

[/lua]