New feature: AutoScale and other new designer script keywords

[Erel]

V2.20 will include the following new designer script keywords:

- Min and Max - same functionality as the equivalent standard keywords

Scaling keywords:

As explained in this thread: http://www.b4x.com/forum/basic4andr...ing-multiple-screens-tips-best-practices.html in most cases you will want to scale the views size and text size based on the device physical size. A naive solution for the size is to use percentage when specifying the dimensions. However the result is a "stretched" UI which in most cases looks bad on larger devices such as tablets.

The scaling method suggested in the above link can now be easily applied with the following three keywords:
- AutoScale - Scales a specific view (left, top, width, height and text size are scaled).
- AutoScaleAll - Scales all views
- AutoScaleRate - Sets the scaling rate (see the above link for more information)

Note that AutoScale methods implement the formula internally. It is no longer required to build it in the script.

The recommended way to adjust your UI is:
1. AutoScaleAll
2. Adjust the views location as required
3. Use SetLeftAndRight and SetTopAndBottom on the views that should fill the available space)

 

[metrick]

Yes! Yes! Yes!

 

[CARTHO]

Ooooooh YES !

 

[mrjaw]

WAooooooo!!!!!

If it is TRUE Erel, will take the place of Wolverine as my new hero!!!!

 

[JonPM]

Icon clap

 

[mrjaw]

When this version is come out ?

 

[Inman]

Wow! I got to learn designer scripts and abstract designer. I always manually created views with code and scaled them with %x and %y. This AutoScale sounds much simpler.

 

[Erel]

When this version is come out ?

Version 2.20 should be released in a few weeks.

 

[AscySoft]

Version 2.20 should be released in a few weeks.

Can't wait! Super!

 

[raiker]

:sign0098:

 

[pluton]

Great work Erel

 

[Hubert Brandel]

Nice to hear :sign0060:

 

[Dominex]

:sign0098:

 

[MaxApps]

Hi Erel

When using AutoScaleAll and AutoScaleRate(1.0) then whole screen is pushed approximately 10% to the right (tested on SG3 and Acer A501).
Any Ideas?

Apart from the 10% to the right, it makes it so easy, that support all screen sizes. Especially the text size has been a constant worry for me.

Can you give an example of how to use Min/Max?

Kind regards
Jakob

 

[Erel]

I don't recommend you to use a rate of 1.0. It is too high. The offset happens because the height / width ratio on this device are a bit different than on the "base" variant ratio.

Button1.Width = Min(30dip, Button2.Width)

 

[Dman]

Note that AutoScale methods implement the formula internally. It is no longer required to build it in the script.

The recommended way to adjust your UI is:
1. AutoScaleAll
2. Adjust the views location as required
3. Use SetLeftAndRight and SetTopAndBottom on the views that should fill the available space)

So the only thing we need in the designer scripts page is the keyword AutoScaleAll and then set the left,right,top and bottom for the views that fill the whole screen?

 

[Erel]

AutoScale and AutoScaleAll scale the left, top, width, height and text size of the the views.

You may also need to set the position of some of the views. For example if you want to "dock" a button to the right side then you will need to call:

Button1.Right = 100%x

 

[Dman]

Thanks!

 

[junaidahmed]

Currently I am working in Samsung Galaxy Tab 8.9 with resolution 1280 X 800 (160 dpi),now i am testing the same application with AutoscaleAll new feature (Basic4Android 2.20) in Samsung Galaxy Note 5.3 with resolution 1280 X 800 (240dpi),but the layout has changed as too big.pls advise how to solve this issue.

 

[Inman]

Does AutoScaleAll work on views that are added by code on run time and not designer?