Android Question Scale & Layout

[imgsimonebiliato]

Hello,
using GetDeviceLayout, the result for my phone is: 720x1280 = 2.0(320dip).
I read all posts of layout but I didn't understand all.
So please, what are the correct dimension to use (for button, label, image...) both for 4'' and 7'' and 10'' devices?

 

[yttrium]

Never use defined pixel dimensions.

You should take a look at the actual Android documentation for how multiple screen sizes work:
http://developer.android.com/guide/practices/screens_support.html

 

[imgsimonebiliato]

Never use defined pixel dimensions.

You should take a look at the actual Android documentation for how multiple screen sizes work:
http://developer.android.com/guide/practices/screens_support.html

Thanks but this does not help me much

 

[yttrium]

Thanks but this does not help me much

If you define text size (labels) using the sp unit, then it will appear the same size physically across all form factors and densities, regardless of physical display size.

It's pretty much trial and error with your own device to see what looks good. As long as you stay away from the px unit, it will automatically scale for all devices.

 

[imgsimonebiliato]

If you define text size (labels) using the sp unit, then it will appear the same size physically across all form factors and densities, regardless of physical display size.

It's pretty much trial and error with your own device to see what looks good. As long as you stay away from the px unit, it will automatically scale for all devices.

I know this. But, I want to understand what does it mean "720x1280 = 2.0(320dip)", so then I can reset all dimensions

 

[yttrium]

I know this. But, I want to understand what does it mean "720x1280 = 2.0(320dip)", so then I can reset all dimensions

720x1280 means the display is 720 physical pixels wide, and 1280 physical pixels tall. You would refer to those individually as px, but you shouldn't.

2.0 means that there is a scale size of 2. If you set something to be 100dip from the left, on a device with a scale of 2.0, it will physically be 200px from the left (this is still 100dip).

The 320dip portion is actually incorrect - I believe it should say 320dpi, which is the physical density of the display. That means there are 320 pixels per inch on the display (Dots Per Inch, correctly referred to while printing, the acronym has just carried over to pixels as well).

A scale of 1.0 would be 160dpi.

 

[imgsimonebiliato]

720x1280 means the display is 720 physical pixels wide, and 1280 physical pixels tall. You would refer to those individually as px, but you shouldn't.

2.0 means that there is a scale size of 2. If you set something to be 100dip from the left, on a device with a scale of 2.0, it will physically be 200px from the left (this is still 100dip).

The 320dip portion is actually incorrect - I believe it should say 320dpi, which is the physical density of the display. That means there are 320 pixels per inch on the display (Dots Per Inch, correctly referred to while printing, the acronym has just carried over to pixels as well).

A scale of 1.0 would be 160dpi.

Please, can you write me an example? For example, how can I set at the center of the screen 2 buttons?

 

[yttrium]

Please, can you write me an example? For example, how can I set at the center of the screen 2 buttons?

For a fixed orientation like this, instead of setting the offset by dip, you should use 50%x in the Designer Scripts, rather than code.

MyButton.HorizontalCenter = 50%x

If you wanted to have the button width scale by width of the display, you would align the buttons like this:

LeftButton.Width = 20%x
LeftButton.Right = 48%x
RightButton.Width = 20%x
RightButton.Left = 52%x

You can change the width of the buttons by increasing the percentage. Note that this is a percentage of the total width of the display. The left button takes up exactly 20% of the display, horizontally. The Right button does as well.

If you didn't want them to scale (have the same physical width regardless of display), but always wanted them to be center-aligned:

LeftButton.Width = 80dip
LeftButton.Right = 48%x
RightButton.Width = 80dip
RightButton.Left = 52%x

You can change this button width by increasing the dip size. Please note that this button will scale to a certain physical width no matter the display size, so you shouldn't set it too large, because it won't scale correctly on small displays that don't have a display wide enough. They'll scale, but will go off-screen.

 

[imgsimonebiliato]

For a fixed orientation like this, instead of setting the offset by dip, you should use 50%x in the Designer Scripts, rather than code.

MyButton.HorizontalCenter = 50%x

Ok, now I know HorizontalCenter..
But for 2 buttons near?

 

[yttrium]

Ok, now I know HorizontalCenter..
But for 2 buttons near?

Sorry, refresh the page, I was editing that into the end of my post.

 

[imgsimonebiliato]

Sorry, refresh the page, I was editing that into the end of my post.

Ok yttrium. Many thanks for your help

 

[imgsimonebiliato]

Hello,
I have the same question for edit and label textsize. How do I set them, available for all type of devices?

 

[eps]

Are you using the Designer or Code to size your layout(s)? If Designer, you can use Autoscale all, in the Tab to scale everything correctly.

If code it's a little harder.. For text size DIP does not apply, so just straight numbers. I usually set a fontsize variable and then adjust accordingly between small, large and extra large devices. Coding only.

Erel has a tutorial about this... http://www.b4x.com/android/forum/threads/supporting-multiple-screens-tips-and-best-practices.17647/

I think in your case you could also define the screen as 360x640 pixel density 1, which covers those devices of that actual screen layout and density and your device which is effectively double that.

 

[imgsimonebiliato]

Are you using the Designer or Code to size your layout(s)? If Designer, you can use Autoscale all, in the Tab to scale everything correctly.

If code it's a little harder.. For text size DIP does not apply, so just straight numbers. I usually set a fontsize variable and then adjust accordingly between small, large and extra large devices. Coding only.

Erel has a tutorial about this... http://www.b4x.com/android/forum/threads/supporting-multiple-screens-tips-and-best-practices.17647/

I think in your case you could also define the screen as 360x640 pixel density 1, which covers those devices of that actual screen layout and density and your device which is effectively double that.

Hello,
I'm using the Code to size text. But, if I use designer, How do I do that?

 

[eps]

It's a whole other approach, which one do you want to do? I do it in Code, but I suspect a lot more others use the Designer. You just have to place all the information on the panel using the Designer and then select the Tab (I forget the name of it) on which the scripts reside.

 

[imgsimonebiliato]

It's a whole other approach, which one do you want to do? I do it in Code, but I suspect a lot more others use the Designer. You just have to place all the information on the panel using the Designer and then select the Tab (I forget the name of it) on which the scripts reside.

Hello,
I created with the Designer the layout attacched. But it's only for device with scale 360*780 = 160 dpi but when I install the same program to a 7'' or 10'' inch device, the image are too small. How do I create a layout with images that increase or diminiuscono their size according to the layout of the device?
lb.... are label, the other are image, such as Promo, u14, u15..

 

[Erel]

Use anchors + designer script to make your views grow as needed.

See the tutorial in my signature.

 

[eps]

Use anchors + designer script to make your views grow as needed.

See the tutorial in my signature.

Indeed, see Autoscale, DIP and ensure that you know the resolution and pixel density of the devices you are testing with.

 

[imgsimonebiliato]

Indeed, see Autoscale, DIP and ensure that you know the resolution and pixel density of the devices you are testing with.

Ok thanks, but with designer how I set the width of a label = activity width?

 

[DonManfred]

set width to 100%x in designerscript