QML fit screen on all resolutions

Question

Hi all I have problem with my QML code. I made mistake and I went to put certain size to elements and now I have problem when putting app on other devices. I will paste you my

Answer 1

Changing the device, you are actually changing the screen pixel density. If you have a device with low quality display it will have lower number of pixels per inch or pixels per centimeter than a device with high quality display.

Understanding this we can easily devise a method to scale our content according to the pixel density. For example in my case I have a laptop on which I use Qt creator. It has pixel density of 4. But my android phone is of high quality which has density of 16(4 times more than my Laptop). It means if an item has a width 'X' and height 'Y' when displaying on my Laptop, on my phone it will appear with a width 'X'/4 and height 'Y'/4 . Thus I have to scale height and width by 4.

Now, How to implement this? In QML we have a property "pixelDensity" under object Screen which will give you the pixel density of the screen where you are running your application. Dividing this by the screen density of screen where you tested your application will give you the scale factor. So now you don't need to worry about other devices you have just find the pixel density of screen you are currently working on.

Following code works perfectly for me.

property int default_pix_density: 4  //pixel density of my current screen
property int scale_factor: Screen.pixelDensity/default_pix_density
Rectangle
{
    width: 50*scale_factor
    height: 20*scale_factor
}