[Marek]

Hi

When I change app resolution from the menu, or using CTRL+1-8 it changes only slightly, debug from QtCreator shows that for keys 1 to 8 it sets resolution:

qml: GameWindow: changing resolution to 557 x 835
qml: GameWindow: changing resolution to 320 x 480
qml: GameWindow: changing resolution to 470 x 835
qml: GameWindow: changing resolution to 469 x 835
qml: GameWindow: changing resolution to 470 x 835
qml: GameWindow: changing resolution to 470 x 835
qml: GameWindow: changing resolution to 626 x 835
qml: GameWindow: changing resolution to 522 x 835

this is nowhere near what the labels say. My screen resolution is 1920×1080, I’m using Linux with QtCreator 4.4.1 and Qt 5.9.3

Maybe I don’t uderstand something about those resolutions, but my app looks very different on a phone with full HD resolution and on desktop during development when I switch to 1920×1080 resolution.

 

Best Regards

Marek

[GüntherFelgo Team]

Hi Marek!

The values you see in the log output are the actual pixel values used for the window size. These are smaller than the sizes specified in the resolution menu, because the full resolution is scaled down to use a maximum size of 80% of the width/height available on your Desktop screen.

Even if the window size is roughly the same, you will see that UI elements like buttons are bigger or smaller depending on the selected device. That’s because the simulation also changes the UI scale to match the pixel density and scaling of the device.

The resolution menu is a quick indicator of how your app will look on different devices, but it is not 100% perfect to the pixel. So it is recommend to still additionally do some testing on real devices.

Best,
Günther

[Marek]

Hi

Sorry for late reply.

I can indeed see some changes in size of buttons etc. However, when I set for instance a TabBar with constant width

AppTabBar {
            id: appTabBar
            width: 900px
}

it won’t be scaled when I switch resolutions. I mean on full HD phone it will have less width than the actual screen width but simulator will not show this, AppTabBar will always be bigger than screen

Probably 4k monitor would be a good idea but for fullHD phone I would need to use more than 80% of the Desktop resolution – is this changeable?

 

Best Regards

Marek

[GüntherFelgo Team]

Hi Marek!

As each device may have a different width or height, an AppTabBar with a fixed pixel-width will always either be bigger or smaller than the actual width of your device. In addition, users may also use your app in portrait or landscape mode if you allow it, which also requires different widths then.

So for using the whole window width, I recommend a responsive layout:

AppTabBar {
            id: appTabBar
            width: parent.width // fill parent width
}

For more information regarding layouts and density/screen-independence, please see: Supporting Multiple Screen Sizes & Screen Densities with Felgo Apps

Best,
Günther