Android Question i will have same visual button size at differnt devices.

[MarkusR]

i saw the tutorial about dip but i don't get it.
as example for a button:
me thought if me input a size value width and height in designer it is dip and the visual size is the same at all devices, but it is not.
me tested also with autoscale on/off.

portrait:
i have a 10" tablet 800x1216 scale 1.33125 (213 dpi)
and i have a phone 720x1184 scale 2 (320 dpi)

in designer i had input 720x1280 scale 2 and then there was a popup and it is saved as 360x640 scale 1 (160 dpi) variant.

 

[CaptKronos]

I have tried on three different devices:

Button1.Width=xdpi 'as per Klaus' post above
Button2.Width=160 * GetDeviceLayoutValues.Scale

On an S8 and a Yota YD201, button2 is slightly larger than 1 inch and button 1 is slightly smaller than 1 inch.
On a Tab S2 (10 inch tablet), button2 is slightly larger than 1 inch and button 1 is pretty much exactly 1 inch.

For my use cases the slight differences don't matter and I would be happy with the results of either approach.

 

[MarkusR]

yes a little bit bigger or smaller would not be a problem.
but the differences at my two devices are too much.

 

[klaus]

later this week, i am on a team event this week.

Lets go further then.

 

[klaus]

later this week, i am on a team event this week.

Any news about your problem ?

 

[MarkusR]

@klaus, thanks for asking, i will continue on this b4a project soon.

 

[MarkusR]

i made a extra test project with 5 buttons side by side
the screen size from my tablet is ~ 10" not 6.83 (from ApproximateScreenSize)
from the values i don't get how the AutoScaleAll create the new button with value.
i made a photo how it looks at my devices.
at device it shows the "what you see is what you get".
with AutoScaleAll i would expect similar layout at device as i set in the layout designer.
there is also a difference in wysiwyg and running app.

'Variant 320 x 480, scale = 1 (160 dpi)
'Button Size in Designer = 50 x 50
'AutoScaleAll

'Logger connected To: CUBE T12
'6.833616532763395
'800 x 1216, scale = 1.3312501 (213 dpi) < Log(GetDeviceLayoutValues.toString)
'Button1 W=85 < Log("Button1 W=" & Button1.Width)
'-----------------------------------------
'Logger connected to: motorola XT1032
'4.330415684434925
'720 x 1184, scale = 2.0 (320 dpi)
'Button1 W=104

compare wysiwyg and running app at tablet.

 

[klaus]

Attached a small test program showing the problem.

This line Log(GetDeviceLayoutValues.toString) returns following values for my two devices:
1536 x 2048, scale = 2.0 (320 dpi) on my Samsung Galaxy Tab S2, real dpi values 265.40399169921875 / 264.0559997558594
1080 x 2076, scale = 3.0 (480 dpi) on my Samsung Galaxy S8, real dpi values 422.03021240234375 / 423.9697570800781
As you see, there is a difference between the real dpi and standardized dpi values!

Both squares (Panels) have a width and height of 160 (1 inch) in the Designer without AutoScaleAll.
The upper square is bigger than the lower one, this is due to the difference between the real scale and the standadized scale.
The lower square has a dimension of 1 inch, 25.4 mm!
It's dimensions have been adjusted with a scale calculated with the real dpi and standadized dpi values.

screenshot of the Galaxy S8

The result of this GetDeviceLayoutValues.ApproximateScreenSize is wrong too on my device (Galaxy S8), like on yours, depending also on the difference between the real scale and the standadized scale.

Be aware that the size of Buttons is a bit smaller than the dimensions you entered in the Designer.
That's the reason why I use Panels to show the difference.

 

[MarkusR]

today i input this tablet size (what the wysiwyg show at connected status) as variant in designer.
its normalized 600 x 913 scale 1 , so its complete different from my 320 x 480 scale 1.
me thought i can just use one variant.

 

[klaus]

The best way, at least for me, is to use one or two layout variants.
One protrait, standard size (320 x 480) and if necessary the second one landscape standard size.
The adjustments are done with AutoScale, anchors and DesignerScripts.

 

[LucaMs]

The best way, at least for me, is to use one or two layout variants.
One protrait, standard size (320 x 480) and if necessary the second one landscape standard size.
The adjustments are done with AutoScale, anchors and DesignerScripts.

I am not so sure.

I don't think today smartphones and tablets with 320 x 480 exist (maybe smartwatches) and using this low resolution you have few space to add views.
Also, many devices have "ratio" different than 1.5 (480/320) and I hope it will be fixed to 1.777 (16/9) in the next future.

So I think using a higher size with ratio 1.777 is a better choice, still using only two layouts as Klaus suggests, just one for portrait and another for landscape.

[Scale 1 !]

[Edit] 576 x 1024, for example (and 1024 x 576)

 

[MarkusR]

i end up today at this project with 2 variants for protrait with autoscale off.
the phone is ratio 1,644 (360x592 scale1) and the tablet 1,521 (600x913 scale1) .
at least the designer view is same as the device screen with a variant for each device.
with or without AutoScaleAll the button size at my both devices are very different but i will live with it now. i think the form designer get wrong values from the device.