How can I set component size according to size & pixel of devices?

[Ibrahim]

Hi;
I have this code:

Rectangle {
  width: 300
  height: 300
  color: 'red'
}

But this is not good for all devices, because they are have different pixels & size.
I use dpi in Android native. How should I set width & height of a component (like Rectangle)? Thanks.

[raven-worx]

@Ibrahim said in How can I set component size according to size & pixel of devices?:

I use dpi in Android native

you mean dp no?

Anyway theoretically you can simulate the dp calculation on any device, using Screen.pixelDensity.
Then create a method (lets call it dp(real px)) and calculate the value considering the density. Then use this method to calculate the width and height instead setting it "statically" to 300.

For example android's dp calculation is x * (screenDpi / 160) (whereas x is the value which should appear the same size on all screens)

[Ibrahim]

@raven-worx thanks.
I think Screen.pixelDensity gives PPI? (https://en.wikipedia.org/wiki/Pixel_density).
x * screenDpi / 160 formula provides DPI, but how can I calculate DPI with Screen.pixelDensity?
And what is 160? Is this formula (static 160) running on all platforms (Android & iOS and desktop)?

[raven-worx]

@Ibrahim

Is this formula (static 160) running on all platforms (Android & iOS and desktop)?

as i said, this is what Android does. In the end it doesn't matter which factor you take - actually thats the definition of a "factor" ;)
In the end you get what you want...the same size on all screens.
If you would change the factor, you would also need to adapt the base value your use to compute the sizes.