Height sizes for Views (programmable)

[Jim Brown]

I am writing a mobile designer for manually creating view layouts. Imagine a mobile version of Designer if you will.
At the moment I plan to save the views layout positions in percentages. The problem is, depending on the display size certain views will either appear as squashed, correct, or stretched.

For example, here is how Seekbars and spinners turn out when using 8%y for the height in different display sizes:

Does anyone know what the correct height values should be for such views, so that they are guaranteed to display correctly?
Should I use dip instead of percentages?

The big advantage of percentages is that I do not need to worry too much about display sizes, since in theory, everything should scale accordingly

 

[thedesolatesoul]

I have this problem with spinners too on the emulator.
On my device they were fine, but then I have only 1 phone, so I dont know how they look like else where.

 

[Jim Brown]

Yep, what I find is, when I use 8%y I get correct looking SeekBars and Spinners on my Galaxy S. The Galaxy Tab though, with its longer height will show such Views in a stretched manor (as per the 3rd image above)

I wonder then how best to know the correct height of such Views so they appear as expected. Are there any recommended fixed height values? Should I use dip, percent, or pixel values?

 

[Erel]

For views the best option is to use 'dip'. You can play with the designer to find the appropriate height.

 

[Jim Brown]

Hi B4A users

Could you be so kind as to test whether the following programmed Views appear correctly on your device?

What you should see is equivalent to this image. I am not sure if devices with 160dpi will give the same type of results though
(I am using a combination of percent for horizontal values and dip for vertical values)

The source code

' Testing views appearance with DIP settings
Sub Process_Globals
End Sub

Sub Globals
   Dim bt As Button
   Dim cb As CheckBox
   Dim tb As ToggleButton
   Dim sb As SeekBar
   Dim sp As Spinner
End Sub

Sub Activity_Create(FirstTime As Boolean)
   Activity.Color=Colors.DarkGray
   ' Button
   bt.Initialize("")
   Activity.AddView(bt,10%x,4dip,40%x,40dip) : bt.text="Button"
   ' CheckBox
   cb.Initialize("")
   Activity.AddView(cb,10%x,46dip,40%x,37dip) : cb.text="Check"
   ' ToggleButton
   tb.Initialize("")
   Activity.AddView(tb,10%x,85dip,40%x,48dip) : tb.TextOff="Off"
   ' SeekBar
   sb.Initialize("")
   Activity.AddView(sb,10%x,135dip,40%x,30dip) : sb.Value=30
   ' Spinner
   sp.Initialize("")
   Activity.AddView(sp,10%x,167dip,40%x,48dip) : sp.Add("Spin")
End Sub

Sub Activity_Resume
End Sub

Sub Activity_Pause (UserClosed As Boolean)
End Sub