I am new to B4A, but the coding of an app has proven to be pretty straightforward. However, the deployment of my app to different screen sizes has proven to be quite a hurdle. Would it be possible for someone to create a Youtube video demonstrating the use of Designer scripts to manage the scaling of a UI to different screen sizes? Specifically, an explanation of the proper use of the new AutoScaleRate and AutoScaleAll key words new to 2.20, what results should be observed when Run Script is executed, best practices when designing an Android UI with consideration for diffenent screen sizes/densities, etc.
-
Welcome to B4X forum!
B4X is a set of simple and powerful cross platform RAD tools:
- B4A (free) - Android development
- B4J (free) - Desktop and Server development
- B4i - iOS development
- B4R (free) - Arduino, ESP8266 and ESP32 development
Training/Demonstration Video for UI Scaling
- Thread starter pixelpop
- Start date
- Similar Threads Similar Threads
Plus one on that one. I have watched all of the B4A vids on youtube. Well, all of the english ones. There are a lot more that I can't understand but I wish I could because there aren't that many in english and I really enjoy what I have watched.
Upvote
0
Ok, the attached sample contains a very simple example, I have added some notes in the designer scripts.
To see the results, just comment/uncomment the lines containing the AutoScale statements, when you change the lines, you will see that the size of the views and font will scale accordingly.
The principle is simple, for example, in the attached sample there are buttons sized 160x100, if you do not use AutoScale the button will be 160x100 on any device, if you do use AutoScale then it will auto scale proportionally depending on the size of the screen, it will be more clear to understand by taking a look at the sample and playing with the views.
I hope that helps.
To see the results, just comment/uncomment the lines containing the AutoScale statements, when you change the lines, you will see that the size of the views and font will scale accordingly.
The principle is simple, for example, in the attached sample there are buttons sized 160x100, if you do not use AutoScale the button will be 160x100 on any device, if you do use AutoScale then it will auto scale proportionally depending on the size of the screen, it will be more clear to understand by taking a look at the sample and playing with the views.
I hope that helps.
Last edited:
Upvote
0
Thanks, NJDude. I'm going to play with this on one of my projects. Looks like I have some work to do though. I originally created all my views in code and I'll have to convert those into Designer views. I thought the coding would be the biggest hurdle to jump in moving to Android, but clearly this and ninepatch graphics are going to consume the majority of my development time. 
And yes, I too have watched the Youtube videos and they are very good and informative. A video is worth 10K words, so I would encourage someone with the knowledge and time to do one on this and UI design considerations in general.
And yes, I too have watched the Youtube videos and they are very good and informative. A video is worth 10K words, so I would encourage someone with the knowledge and time to do one on this and UI design considerations in general.
Upvote
0
A couple of questions:
1. How does scaling affect views that are created in Designer but sized in code? For instance, I have a label that I create in Designer, but in code I set the height of the label based on the amount of text assigned to it using MeasureMultilineTextHeight.
2. Are Designer scripts modifiable in code? For instance, in your example you set Button2 to be 20dip below Button1. If I needed to change that spacing based on some condition derived in code, could the Designer script be changed in code to reflect that change?
Thanks.
1. How does scaling affect views that are created in Designer but sized in code? For instance, I have a label that I create in Designer, but in code I set the height of the label based on the amount of text assigned to it using MeasureMultilineTextHeight.
2. Are Designer scripts modifiable in code? For instance, in your example you set Button2 to be 20dip below Button1. If I needed to change that spacing based on some condition derived in code, could the Designer script be changed in code to reflect that change?
Thanks.
Upvote
0
