Android Tutorial Designer Scripts & AutoScale Tutorial

klaus · Oct 21, 2012

Attached you find a pdf tutorial about Designer Scripts & AutoScale.
It includes Erels Designer Scripts Tutorial and a new AutoScale Tutorial.
It's an extract of two chapters from the next Beginner's Guide edition.

The pdf document has been removed, it is outdated.
The Beginner's Guide is updated with newer functions.

Three examples are explained:
1) a simple example with only one layout file and one layout variant AutoScaled. Showing also the influence of the rate factor.

2) the same example but with two layout variants portrait and landscape AutoScaled.

3) a more advanced example with several activites showing:

Main Main screen with an image and button to select different examples.
The image size is adapted to the screen size.
Setup screen With a specific layout.
This example uses the setup layout of the GPSExample program.
The setup is a ScrollView with a Panel and several smaller Panels
on it. Depending on the screen width there are one or two columns.
About screen with a specific layout.
DBWebView Database shown in a WebView using DBUtils.
With a new DBUtils module allowing to set the TextSize property.
DBScrollView Database shown in a ScrollView.
The views are scaled in the code.
Keyboard a numeric keyboard example.
The key views are added in the code and scaled using the
Scale module.
Scale module allows to scale views added in the code based on the same equations as those used in the Designer Script AutoScale.
Functions:
- GetScale Gets the scale with the Rate value set with SetScaleRate
- SetScaleRate(Rate) Sets the Rate value
- GetDevicePhysicalSize Gets the physical size of the device in inches.
- ScaleView(View) Scales the given View with the current scale
- ScaleAll(Activity) Scales all the views of the given Activity or Panel
  with all their child views.
- SetReferenceLayout allows to set another reference layout than the standatd one.
  Example: Scale.SetReferenceLayout(800, 1280, 1)
  sets 800 * 1280 * 1 layout as the reference layout
  In this case the ScaleRate has no influence.
- The module supports also ScrollView2D, but if you don't use it you should comment out the relevant lines in ScaleView and ScaleViewDS routines.

Best regards.

EDIT: 2013.09.18
A new version of the AutoScale Module AutoScaleExample7 is available below.
Added SetReferenceLayout as reported in post #31
Added HorizontalScrollView

www.b4x.com/android/files/DesignerScripts_AutoScale.zip

LucaMs · Jun 6, 2014

klaus said:
@LucaMs

2. Unfortunately the Scale module doesn't work well with FullScreen nor without Title, it assumes that both are active.

I vaguely remember that in your module, in fact, you consider the 50dips.
Perhaps it would be possible to modify it with a couple of parameters in the initialization.

I'll try.

Thank you, Klaus

LucaMs · Jun 6, 2014

I made the changes and at first glance it seems to work.
But I have not done tests on other layouts/devices for the moment.

I post only the changed parts.

B4X:

Public Sub Initialize(FullScreen As Boolean, TitleShown As Boolean)
    Private ActAttrAdapter As Int = 50
    If FullScreen Then
        ActAttrAdapter = ActAttrAdapter - 25
    End If
    If Not(TitleShown) Then
        ActAttrAdapter = ActAttrAdapter - 25
    End If
' In the rest of this routine 50 must be replaced by ActAttrAdapter
End Sub

Public Sub SetRate(cRate As Double, FullScreen As Boolean, TitleShown As Boolean)
    Initialize(FullScreen, TitleShown)
End Sub


Public Sub SetReferenceLayout(Width As Int, Height As Int, Scale As Double, _
                              FullScreen As Boolean, TitleShown As Boolean)

    Initialize(FullScreen, TitleShown)
End Sub

ilan · Jun 6, 2014

thank you klaus i checked the bal file you uploaded here. i will use this configurations

thank you

klaus · Jun 6, 2014

@LucaMs.
To be complete you should use a code, like below, to take into account all possibilities:

B4X:

Private ActAttrAdapter As Int
If FullScreen And Not(TitleShown)  Then
    ActAttrAdapter = 0
Else If Not(FullScreen) and TitleShown Then
    ActAttrAdapter = 50
Else
    ActAttrAdapter = 25
End If

LucaMs · Jun 6, 2014

klaus said:
@LucaMs.
To be complete you should use a code, like below, to take into account all possibilities:

B4X:

Private ActAttrAdapter As Int If FullScreen And Not(TitleShown) Then ActAttrAdapter = 0 Else If Not(FullScreen) and TitleShown Then ActAttrAdapter = 50 Else ActAttrAdapter = 25 End If

It is the same

klaus · Jun 6, 2014

Yes, you are right .
This shows that there are different way to get to Rome.

LucaMs · Jun 6, 2014

klaus said:
Yes, you are right .
This shows that there are different way to get to Rome.

In my case, I can sit still here

LucaMs · Jun 28, 2014

I found a little error, Klaus.

B4X:

Public Sub SetReferenceLayout(Width As Int, Height As Int, Scale As Double, _
                                        FullScreen As Boolean, TitleShown As Boolean)
     '   If cRefWidth < cRefHeight Then
    If Width < Height Then

klaus · Jun 28, 2014

Thank you Luca.
I will change the original project.

Big JR · Jul 8, 2014

I don't see a link to the pdf tutorial. It's not in the example7 zip.

klaus · Jul 8, 2014

The link is at the bottom in the first post just above Attached file. Here the link again.
You find it also in the Beginner's Guide.

LucaMs · Dec 27, 2014

Strange phenomenon (that Klaus will explain in the usual two minutes ).

I create a single variant, width = 1280, height = 800.

Well, I have to use:

B4X:

Scale.SetReferenceLayout (800, 1280, 1, True, False)

instead of:

B4X:

Scale.SetReferenceLayout (1280, 800, 1, True, False)

so that i get the desired result.

klaus · Dec 27, 2014

Yes, because the Scale module is more clever than you think.
The reference screen dimensions are in portrait, the Scale module takes into account the other orientation.
Otherewise if you have in the same layout file a portrait and a landscape variant the Scale module would be lost!

LucaMs · Dec 27, 2014

klaus said:
Yes, because the Scale module is more clever than you think.
The reference screen dimensions are in portrait, the Scale module takes into account the other orientation.
Otherewise if you have in the same layout file a portrait and a landscape variant the Scale module would be lost!

Thank you, Klaus.

Given my infamous memory, I think I will change the name to the parameters, then.

PortraitWidth instead of Width, PortraitHeight instead of Height

JTKEK · Aug 16, 2015

it is possible to make it full screen for small screen and not full screen for a bigger screen

B4X:

If Scale.GetDevicePhysicalSize > 6 Then
        #FullScreen: false
    Else
        #FullScreen: true
    End If

Erel · Aug 16, 2015

You should have started a new thread for this question. It is not possible unless you create two different builds.

ilan · Aug 16, 2015

Erel said:
You should have started a new thread for this question. It is not possible unless you create two different builds.

I think there could be a solution erel

First activity is just a logo page and in this activity he ask for the screen size then

He creates 2 SAME activities 1 full screen 1 not fullscreen and he start that activty that he want, depend on the screensize...

(just a tought )

incendio · Aug 27, 2015

I have design a layout for 10" tablet, it looks fine, but when load on 7" tablet, the display is bad and I can got a correct value for Scale.SetRate to fix the display.

Attached is the screen layout for 10" & 7" tablet, and the source code.

Is that a design flaw in my layout or I use scale class in the wrong way?

Erel · Aug 27, 2015

It is better to start a new thread for this question.

AutoScaleAll only slightly scales the views size and position. It is better to design a smaller layout and let auto scale handle the larger screen.

klaus · Aug 29, 2015

Try to use Scale.SetRate(1).
This will strech the layout according to the new screen size.

Android Tutorial Designer Scripts & AutoScale Tutorial

Attachments

Expert

Expert

Expert

Expert

Expert

Expert

Expert

Expert

Expert

Member

Expert

Expert

Expert

Expert

Member

B4X founder

Expert

Well-Known Member

Attachments

B4X founder

Expert

Similar Threads

Privacy & Transparency

Privacy & Transparency