[Jeff]

I’m making a scene where there is a grid at the bottom of the screen:

Scene
{
id: board

width: iwinwidth  //640
height: iwinheight  //960

Rectangle
{
id: gridback
width: iwinwidth
height: width
y:iwinheight-iwinwidth
color: “#666666”
radius: 5

}

etc

 

So, gridback is just setting the y position to pop it down to the bottom on the screen (in portrait mode).  Now, if I’m in iphone 4 mode, and I place runtime created elements on top of this grid using (iwinheight-iwinwidth) as the offset – everything works great, but if I set iphone X mode, everything is WAY off.

I thought the whole point of a gamewindow is that I just set screenWidth and screenHeight of the GameWindow, and then everything is virtualized to this coordinate system?  Are entities on a different coordinate system?

Can I just query where gridback ended up, and then then use that offset to relatively position the entities?

 

[GüntherFelgo Team]

Hi,

to learn more about how the scene-scaling works, you can see here: https://felgo.com/doc/vplay-different-screen-sizes/

As you set:

y:iwinheight-iwinwidth for your grid, the grid’s y-position will be different for devices with different width / height ratios.
As for iPhone X, we have a nice tutorial here: https://felgo.com/cross-platform-app-development/notch-developer-guide-ios-android

 

Best,
Günther

[Jeff]

No, I read all that – I mean, I don’t see how something as simple as a scale and bias can turn into all this nonsense, but whatever.

My point is why do *some* elements go through the scaling and some don’t?  That’s the silly thing – the runtime created entities should go through the same scaling as everything else, sigh.

But whatever, I just turned off all scaling – I can do that myself in a much more rational way.  However, how do you get the bias (the offset) of the base screen, on the iphone X.  I just want to query the constant to find the 0,0 of the screen so I can create the runtime elements with this same offset…

[GüntherFelgo Team]

All elements within a scene, including runtime created entities, scale along with the scene. To control alignment of UI items in respect to the iPhone X safe zones, you can use e.g. the Scene::gameWindowAnchorItem or fullWindowAnchorItem.

The pixel value of iPhone X screen insets is available with NativeUtils::safeAreaInsets.

[Jeff]

OK, so if I add (-board.gameWindowAnchorItem.x, -board.gameWindowAnchorItem.y ) to the position that I dynamically position things with, then everything aligns on Windows.

But on iOS, the numbers are wildly off.

On Windows, the values are (-131,0) with emulating an iphone X.

On an actual iphone X, the values are (+295,0).

 

[Jeff]

But on iOS, the numbers are wildly off.

OK, it looks like this is because in the onCompleted() callback, the gameWindowAnchorItem() data is not set.  It snaps in later.