Text resize

postasat

Active Member
Licensed User
Longtime User
I made a program using two layout with different resolution:
- 480x320 sc.1
- 800x600 sc.1

In the greater resolution I have choose a font with size 40 (in designer).
When I launch the program in the little resolution the size of the text is very large (because is always size 40).
If I change the size in designer "little resolution" the font are resized also in the higher resolution and so is too little.

How can I do to have the "same" size of text in both resolution ?

Thanks.
 

klaus

Expert
Licensed User
Longtime User
Font sizes are physical sizes.
When running the program you must test the size of the device and change the font size in the code.
If you have FontSize = 40 for the big screen you must change it to FontSize = 20 for the small device by code. You should use a variable for the font size.

Best regards.
 
Upvote 0

postasat

Active Member
Licensed User
Longtime User
I have 10 label, 5 edittext, 3 buttons and one togglebutton.
Every of them have different font size.
How can I scale it ?
I must change by code the textsize to each of them ?

Thanks.
 
Upvote 0

mhc

Member
Licensed User
Longtime User
There is one more option: using dip for scaling.
I have had the same problem - and tried out different ways. First of all was using different layouts for possible resolutions. But how can you be sure that it is running on all devices with different sizes of displays?
I solved it in this way:
B4X:
Sub Layout_Init
...
   
             Label1.Width=220dip
   Label1.Height=370dip
   
   Label1.Left=(Activity.Width-Label1.Width)/2
   Label1.Top=(Activity.Height-Label1.Height)/2
   ...

   lblMin1.Width=40dip
   lblMin1.Height=40dip
   lblMin2.Width=40dip
   lblMin2.Height=40dip
   lblMin3.Width=40dip
   lblMin3.Height=40dip
   lblMin4.Width=40dip
   lblMin4.Height=40dip
              
   ...

   lblMin1.Left=Label1.Left-40dip       
   lblMin1.Top=Label1.Top-30dip  
   
   
   lblMin3.Top= Label1.Top+Label1.Height-20dip  
   lblMin3.Left=Label1.Left+Label1.Width  
   
   lblMin2.Left=lblMin3.Left
   lblMin2.Top=lblMin1.Top
   
   lblMin4.Left=lblMin1.Left
   lblMin4.Top=lblMin3.Top
   
             ...

   
End Sub

As you can see I made only one layout with the designer. Than I added a subroutine to init the layout: First I take one view (component) - in this example Label1 - using its origin position and width and write the values as dip.
This is my "main component". All other components are set in relation to this one: lblMin1.Left=Label1.Left-40dip for example.
In the designer Textstyle is set to monospace and center.

It is also an additional work, but it works on different devices with different resolution and density. I tested it on Galaxy and Huawei smartphones as on Cat Nova tablet.
The advantage is we have not to design different layout for all possible devices on the market. And the text of the components is resized automatically with the right formatting.

mhc
 
Upvote 0
Top