Iphone X display is displaying objects in a different spot

[mammothinc]

So I have made a game and I am currently testing it on different apple devices. My iPhone X is displaying a text box in a weird way. See the videos and images below.

Also, the music isn't loading properly on the iPhone or the iPad. When I go to the main level, it simply doesn't load.

I think this has something to do with Cordova. The iPhone X is problematic when it comes to displays. This is even an issue for other developers and other environments.

It might be worth looking and testing games on multiple devices. There are a few cloud services that can do this for you.

Impossible Odyssey (1).c3p.zip

Capto_Capture 2019-08-30_07-43-34_AM.mov.zip

[AshleyScirra]

That's odd. Are you able to provide a minimal project that demonstrates just the issue? Typically we need this per individual problem to be able to identify the cause. That includes both any object positioning issues and separately any music playback issues, and these should be tracked in separate issues too to avoid each becoming confused with the other. Also does the iPhone X issue reproduce in the Safari browser too or only in Cordova?

[mammothinc]

Are you able to provide a minimal project that demonstrates just the issue?

• have added the project in a zip for you

Also does the iPhone X issue reproduce in the Safari browser too or only in Cordova?

• This is only on the Xcode export and on Apple devices. Everything works well in safari.

[shortercode]

It's not particularly easy for me to test a HTML export on an iPhone X for complicated reasons, but I have tested the iOS export on a simulated iPhone X and can confirm the 2 are offset. This is different to a physical iPad pro where they both appear at the same height on iOS export and HTML export. A quick investigation shows this to be caused by differing anchor settings on the text element. One is anchored relative to the viewport bottom, the other the viewport top. I'm unsure why it causes a discrepancy but swapping them to use the same resolves the issue for me. Viewport height is quite strange on the iOS export, due to cordova/wkwebview/iPhoneX oddities so it's not exactly surprising.

[mammothinc]

So I have been going through the Xcode project and there are lots of depreciations. This version of Xcode has a new UI scheme called SwiftUI.

It's radical departure from previus versions.

I would suggest always testing the iPhone X series on the device. It plagues all developers.

THere's also the issue of it not being sized correctly. This will impact sales for developers as apple really wants the screen size to work correctly.

[shortercode]

SwiftUI is a reactive UI framework. It's Apple's version of Flutter, or React.js. As we're not using UIKit at the moment it doesn't affect us. It's for application layout, not game development.

As I mentioned in my previous comment the text appears in the wrong location because the 2 text items are anchored differently. I expect the workaround we have in place to resolve the strange behaviour of the webview on notched iOS devices causes the bottom of the viewport to move, hence confuses the anchor behaviour.

We've done a fair bit of testing on a simulated iPhone X, but we unfortunately do not have a physical one for testing. As I mentioned on #3244 in my testing it behaves correctly on the simulator when viewport fit cover and hide statusbar are both set.

[shortercode]

Going to reassign this to @AshleyScirra to look at, as it appears to be a timing issue with the Anchor behaviour on the iPhoneX. We have put some other fixes in place since this issue was filed I believe, so it might not be an issue anymore.

[AshleyScirra]

I can still reproduce this on an iPhone X, but as noted the two text objects do use different viewport positioning settings (one anchors the top edge to viewport top, and the other to viewport bottom). Further, notch devices do funny things with their screen size calculations, since there are two sizes (the full size and the safe area size). Therefore it seems possible it's doing what you asked it to, and producing two different results for two different settings. It's difficult to tell with a full project like this, which is why we ask for a minimal project in the bug report guidelines. As noted previously using the same setting for both objects results in the intended and consistent positioning, which seems to be an obvious workaround. Therefore closing this issue - if you still want this to be investigated please file a new issue with a minimal project as per the guidelines.