Android Question Screen size tips

[Emme Developer]

Hi all!
In these days i was figuring about a right text size and general UI design. I generally use designer to make good layout for different devices.. but in Samsung device (don't know about other else) is possibile to set screen dimension (small, medium and big) and text dimension... any tips to make a good ui in order to avoid biggest text size with maximum text size setting, and smallest text size in minimum setting?

Thanks to all!

 

[NJDude]

My recommendation, DO NOT use individual variants, just use the "All Variants" in the designer scripts, that will solve all those issues and that's all you need.

 

[Emme Developer]

My recommendation, DO NOT use individual variants, just use the "All Variants" in the designer scripts, that will solve all those issues and that's all you need.

I use Always it.. but i design my layout using sometimes script, many times i use anchor. Are them work as scripts and avoid variants issue? Because i tried but doens't seem to work. I also checked the dimension of 1dip, if i set screen to small, i got 3pixel, if i set to big i got 4pixel...

These are the logs with this code:

Log(GetDeviceLayoutValues.Width)
    Log(GetDeviceLayoutValues.Height)
    Log(1dip)
    Log(GetDeviceLayoutValues.Scale)

'Small
1440
2560
3
3.5

'Normal
1440
2560
4
4

'Big
1440
2560
4
4.5

 

[NJDude]

Just forget about "small" "medium" "Big", just use the scripts, design your UI properly and you are golden. Simple as that.

 

[Erel]

I agree with @NJDude. Create as few as possible variants. You should instead use anchors and the designer script.

 

[Emme Developer]

I tried to use anchors, designer script and all other things that i know. But my text size looks bad..
S6edge, 1440 x 2560, dpi 640, scale 4

Max screen size, max text size


Medium screen, medium text size

 

[Erel]

Hard to say anything without seeing the layout file.

 

[Emme Developer]

I attached bal file. Is a simple layout. Textsizes are setted in code, because i use a custom font. This is the code:

lbtop.Text = notif.text
            lbtop.TextColor = Utils.black
            lbtop.TextSize = Textsize.NotifText '21
            Dim jo As JavaObject = lbtop : jo.RunMethod("setLines", Array As Object(2))
            lbtop.Ellipsize = "END"
            lbtop.Typeface = Utils.SansLight
            refl.Target = lbtop
            refl.RunMethod3("setLineSpacing", 1, "java.lang.float", 0.75, "java.lang.float")
         
            lbunder.TextColor = Utils.Azzurro
            lbunder.TextSize = Textsize.InfoText '12
            lbunder.Typeface = Utils.SansSemibold
            SetLbUnder(imgEvent,lbunder,notif)
            lbunder.Ellipsize = "END"
            lbunder.SingleLine =True
     
            Sleep(0)
            Dim count As Int = Utils.getLineCount(lbtop)
            If count > 1 Then
                lbunder.Gravity = Gravity.CENTER_VERTICAL
                lbtop.Gravity = Gravity.CENTER_VERTICAL
            Else
                lbtop.Gravity = Gravity.BOTTOM
                lbunder.Gravity = Gravity.CENTER_VERTICAL
                lbtop.Top = p.Height/2-lbtop.Height
                lbunder.Top = p.Height/2+2dip '6dip
                imgEvent.Top = lbunder.Top
            End If

After reading different tips online, i figured out that i should to add different text size for different layout (hdpi,xhdpi,xxhdpi,xxxhdpi) using res/values, so i think i should use xmllayoutbuilder, but i did not understand how to get these values... i saw application that avoid my problem, for example gmail, and as far i know (maybe i misunderstood some thing) i cannot avoid this problem simply setting a single text size... i tried also different routines


Another thing i found.. https://developer.android.com/guide/topics/ui/look-and-feel/autosizing-textview.html

 

[NJDude]

You are really complicating things, if you use the AllVariants and ScaleAll that will solve most (if not all) of your problems.

 

[Emme Developer]

You are really complicating things, if you use the AllVariants and ScaleAll that will solve most (if not all) of your problems.

I tried to set textsize 21 on designer, and use ScaleAll, but this doesn't help me. I see the text very very big when i try to set text bigger (in android setting)

 

[Erel]

After reading different tips online, i figured out that i should to add different text size for different layout

Not needed.

Textsizes are setted in code, because i use a custom font.

I don't see how it is related. And you can also set the custom fonts with the designer.

I see the text very very big when i try to set text bigger (in android setting)

This is a different issue. You can "disable" this setting if you like: https://www.b4x.com/android/forum/threads/get-size-of-system-font-in-use.28065/#post-181853

 

[Emme Developer]

I don't see how it is related. And you can also set the custom fonts with the designer.

How can I set custom fonts in designer? Should I ask it in new thread?

This is a different issue. You can "disable" this setting if you like: https://www.b4x.com/android/forum/threads/get-size-of-system-font-in-use.28065/#post-181853

Maybe I unclrearly explain what Is my problem. Is this my issue, I don't want to disable user scale, I want to learn how to set right text size in order to avoid issue with this setting. Now I lock text size in a specific range, based on available userscale, and it works, but I don't know if is a good practice

Thanks for your patience

 

[Erel]

How can I set custom fonts in designer? Should I ask it in new thread?

Yes.

Maybe I unclrearly explain what Is my problem. Is this my issue, I don't want to disable user scale, I want to learn how to set right text size in order to avoid issue with this setting.

I see. I previously misread your question.

There isn't any simple solution for handling all possible text sizes (except of reverting the custom text scale). You can see similar issues in system apps as well.
It depends on your app audience, but I'm not sure that you should spend too much time with perfecting the layout for the biggest possible text size. At least not in the first version of your app. I guess that 95+% of your app users will use the default setting.

- It is important to set the Ellipsize property to all relevant views. You can also set it in the designer.
- Make sure that the label sizes are as large as possible. It seems like the label that shows TP-LINK doesn't use all the available space.
- I would start without this code. Instead set whatever you can in the designer and leave some extra space for larger font scales.

 

[Emme Developer]

Yes.


I see. I previously misread your question.

There isn't any simple solution for handling all possible text sizes (except of reverting the custom text scale). You can see similar issues in system apps as well.
It depends on your app audience, but I'm not sure that you should spend too much time with perfecting the layout for the biggest possible text size. At least not in the first version of your app. I guess that 95+% of your app users will use the default setting.

- It is important to set the Ellipsize property to all relevant views. You can also set it in the designer.
- Make sure that the label sizes are as large as possible. It seems like the label that shows TP-LINK doesn't use all the available space.
- I would start without this code. Instead set whatever you can in the designer and leave some extra space for larger font scales.

Thanks for the tips. I simply create an "ovveride" for available font scales, and for me works. This is the code, hope that can help someone

'Starter service
    Dim ac As Accessiblity
    Utils.Scale =  0.8999999761581421 / ac.GetUserFontScale
    Dim numbers() As Float = Array As Float(0.8,0.9,1.0,1.1,1.2,1.35,1.5)
    Dim closest As Float = 0
    Dim ac As Accessiblity
    Dim numb As Float =$"$1.2{ac.GetUserFontScale}"$
    For i = 1 To numbers.Length-1
        If Abs(numb - numbers(i)) < Abs(numb-numbers(closest)) Then closest = i
    Next
    Dim val() As Int = Array As Int(-1,-1,0,1,1,2,2)
    Utils.RightTextValue = val(closest)

'Utils
Public Scale As Double = 1
Public RightTextValue As Int = 0

Sub getTextSize(size As Int) As Int
Return size * Scale + RightTextValue
End Sub

I use the scale because when i tried to set the layout, i set properly text size using my screen with small text scale (0.89), but anyone can use medium text scale (1) and set utils.scale to 1 with textsize / ac.getUserFontScale