New feature: AutoScale and other new designer script keywords

Erel

B4X founder
Staff member
Licensed User
Longtime User
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)
 

mrjaw

Active Member
Licensed User
Longtime User
WAooooooo!!!!!

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

Inman

Well-Known Member
Licensed User
Longtime User
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.
 
Upvote 0

MaxApps

Active Member
Licensed User
Longtime User
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
 
Upvote 0

Dman

Active Member
Licensed User
Longtime User
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?
 
Upvote 0

junaidahmed

Well-Known Member
Licensed User
Longtime User
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.
 
Upvote 0

Inman

Well-Known Member
Licensed User
Longtime User
Does AutoScaleAll work on views that are added by code on run time and not designer?
 
Upvote 0
Top