iOS resolution scaling on some models

Hi,

we are experiencing a frustrating issue with iOS resolution scaling.
The game is not properly rendered on the following devices we could test on:

  1. iPad Air (model A1474)
  2. iPhone X (model A1901)

The graphics are all stretched and the GUI does not cover the whole screen anymore, although the GUI it is not stretched.

The game resolution is set to 1280 x 720, Fullscreen, no High DPI.

We already added the correct Launch Images: at first we were experiencing the scaling issue also on an iPhone 6. On the latter device adding the properly sized launch images fixed the issue but this is not working with the other two devices.

We are deploying for development and for production and the issue happens in both cases.
We also analyzed the unbundled code and assets (uncompressed .ipa) which come with the build and we can confirm that:

  1. The launch images for both devices appear in the bundle
  2. The launch images are properly sized .png (2048x1536 || 1536x2048 on iPad Air and 2436x1125 || 1125x2438 on iPhone X)
  3. The info.plist file seems consistent with the launch images (filename on the plist and actual filename@size coincide)

We are using a custom renderer, but changing to default renderer does not fix the issue.
Unfortunately we do not know what else to look at.

What else could cause this behavior?

Are you using more than one display profile and gui layouts? Does the rest of the game render across the entire screen?

@britzl Thank you for your reply.

Yes the game renders across the entire screen, but graphics is all stretched out, that is it doesn’t accomodate the device screen ratio. This instead happens on the iPhone 6: if we remove the launch images the rendering messes up as on the other devices.

The display profile we use is as follows:

profiles
{
  name: "Landscape"
  qualifiers {
    width: 1280
    height: 720
  }
}
profiles
{
  name: "Portrait"
  qualifiers {
    width: 720
    height: 1280
  }
}

The GUIs use only one layout:

layouts {
  name: "Landscape"
}
adjust_reference: ADJUST_REFERENCE_PARENT
max_nodes: 512

And this is one of the root nodes which do not show as it should (it doesn’t stretch to cover the whole screen: on iPhoneX it covers up to 3/4th of the screen as opposed to the whole width):

type: TYPE_BOX
  blend_mode: BLEND_MODE_ALPHA
  texture: ""
  id: "box"
  xanchor: XANCHOR_NONE
  yanchor: YANCHOR_NONE
  pivot: PIVOT_NW
  adjust_mode: ADJUST_MODE_STRETCH
  layer: ""
  inherit_alpha: true
  slice9 {
    x: 0.0
    y: 0.0
    z: 0.0
    w: 0.0
  }
  clipping_mode: CLIPPING_MODE_NONE
  clipping_visible: true
  clipping_inverted: false
  alpha: 0.01
  template_node_child: false
  size_mode: SIZE_MODE_MANUAL
}

Also, few more infos:

If we change the render game projection from stretch to fixed fit, we letterbox the game (which would be acceptable, although not ideal) but the gui, although now covers the proper area, wrongly detects touch inputs: clicking on a button does nothing, but clicking few pixel away from the button triggers the event, that is gui.pick_node responds “correctly” to where the button should be if the render was correctly adapting to the screen.

I think this is the default behaviour of the render script.

I would suggest you to use the RenderCam extension addon ( https://www.defold.com/community/projects/84064/ ). This will take care of scaling with different aspect ratios and also translating input to the correct space.

@defold: don’t you guys think it would be beneficial to have a better default render script, that would take care of aspect ratios and world to screen coordinated? It doesn’t have to have all the bell and whistles like camera shake etc, but something with a bit more power.
I’ve seen a lot of first time users who are confused by this behaviour.

1 Like

Can you share the project or a part if it with me so I can take a look on monday? (bjorn.ritzl@king.com)

When you change projection you’ll run into problems with input. You need to translate input yourself, or better yet, use Rendercam as was suggested.

1 Like

In the end we sorted out the issue, which was a weird mix of bugs and mistakes that together were causing the game to render in a way very closeto how iOS displays the view when LaunchImages are not provided.

Namely:

  1. The GUI was set on fit adjust mode instead of stretch.
  2. The stretch_projection obviously was doing its job of stretching the world view. We mistakenly assumed that it would have kept also the w:h ratio constant.
  3. Buttons were mistakenly implemented as a game object instead of a gui node so we needed to transform back inputs to world in order to press it, as opposed to GUI nodes.
  4. iPhone6 rendered everything correctly because its screen ratio is very similar to our target resolution (720x1280) so we couldn’t notice the stretch.

The resolution we picked is a good compromise to support the majority of our target devices and due to some of our scenes requiring full visibility we opted for letterboxing the view.
We switched the world projection from stretch to fit and set fit as the adjust mode of all of our GUIs.
We applied the world->view->proection inverse to convert touch inputs to world coordinates.
Everything is now seems to be working as intended :slight_smile:

Thank @britzl and @gianmichele for the assistance and for pointing us in the right direction.

3 Likes