My app is not showing well on other phones

Good morning everyone, I made a test screen with components (“buttons”, “labels”, “images”).
But it turns out that while I try it on my cell phone it shows with the dimensions I want.
But if I try it on other cell phones I have the problem that the “button” “label” “image” is very large or small according to the resolution and density of each cell screen.
How can I make an APP look the same on different phones?
I would appreciate your help … Thanks

1 Like

You can set button, label and image height and width in % so when app is used on smaller or larger screen then they acquire height and width according to that.

2 Likes

If you have a room that is 8ft long, and you put a table that’s 4ft long, then you have 4 ft left of empty space, right?
Now if you move that same table to a room that is 6 ft long, will you still have 4 ft of empty space?
Of course not. You have to resize that table (button, image, etc) depending on the room (device screen).
That’s why you have to use percentages % and not pixels to size or position you components.

4 Likes

See also here , it might help you

1 Like

I appreciate your prompt response … is that new to this, I understand to put percentage, but how do I do with the letters? … since when I use let’s say 65% of width in a button and letter in 18, the size varies in other devices and they are smaller, but the percentage in width of the button is maintained.

I don’t use buttons a lot lately. The few projects I work on, are mainly games and graphics that use canvas. But I noticed the buttons are not very friendly when changing their size. In that case, I would use a label and make it clickable instead.

You can get the screen density (dpi) and calculate the font size relative to the screen size and the DPI.
Also check the link @dora_paz mentioned above.

1 Like
1 Like