Place pre-made components on the screen as grid few columns

[arsen...@gmail.com]

Hello,

I've made a component in UI Designer. It has an image and two labels inside it.

Now I want to add them programmatically to main form as a grid, and number of this components should depend on real device screen width.

That means, that I want to have 5 components in one row on iPad with 768px screen width, and only 2-3 on mobile phone with same 768 pixels screen width.

Is it possible to get real device screen width in centimeters programmatically on all types of mobile OSs?
Or, somehow, set default component width in centimeters, which can vary a little, but will appear on the screen with suitable for use size?

I've tried to use Display.getDeviceDensity() but it works not as in android. Output of this method depends only on screen width and screen height. As I correctly understood purpose of getActualDisplayHeight() method.

Also, image will differ between each other on the screen, and their sizes will differ too, nevertheless components should have same sizes.

What do I need to do - is to have grid with variable number of components in one row, which depends on real screen width, to show components with suitable for use size.

[Shai Almog]

Hi,
the GridLayout can automatically calculate the optimal number of columns so you don't need to do all that.
Display.getDisplayWidth/Height returns exact pixel value of the display size.
Display.convertToPixels will give you a close approximation of the pixel count per millimeter.

[arsen...@gmail.com]

Hello,

How can I set default width of my component? On what does it depends?

At the moment, there are two variables, that affect its width. Width of label with the image inside (I think, it's influenced by image size), and preferred size made by GridLayout.

I need to have these components with same size between each other.

Thank you.

[Shai Almog]

Hi,
Grid layout sizes all the components identically based on the preferred size of the largest component.
Components preferred size is a function of its text/icon/layout/border & padding. You can override it using setPreferredSize() but that's generally not a good idea since it would break the calculated behavior.