How do i adjust components according to screen size?

MIT App Inventor Help
,
1

Hi guys! this is the first time im asking a question here :innocent:

Is there any possible way to create a function were you can adjust all the components of your screen according to your screen size?

since i already made my app's UI, its hard for me to adjust all the component's hights and widths using the percentage option, so i thought why not adjust all the components when the screen initializes.

I found a way to do this using a list of components an all, but since my app is too big, its not practical to make a list of components. here's what i mean,

if i consider only labels and if i only have 3 of them,

 for each item in list [ Label1,Label2,Label3] {

    set label.fontsize of item to    [Label.fontsize + ([screen1.width X screen1.hight] / a constant) ]       //<----  havent worked on the equation yet..

by doing this, if the result of the equation is a minus value, the label fontsize will be smaller than the original and vice versa.

The problem i have here is, I CANT CREATE A LIST :frowning_face:

my app is too big, it has A LOT of components so its literally impossible to create a list for every component and component type. is there a way to implement this function with a block that gives out a list of the components according to their type? "get all [component type]"

something like this,

 for each item in list [get all 'labels'] {

    set label.fontsize of item to    [Label.fontsize + ([screen1.width X screen1.hight] / a constant) ]

I searched everywhere for an extension that could possibly contain a block with this function,

if there's anyone out there who could create an extension on this or could find me a better solution, it would be a really great help :pray:

2

I usually press full parent

3

that would help with the adjusting the height and width problem, but what about fontsize?

the font size stays constant no matter the component hieght and width ryt? :eyes:

4

See here:

https://groups.google.com/g/mitappinventortest/c/_b6jmQGNugI/m/Euzrc3LUDgAJ

5

it doesnt seem to do anything than multiply the font size by 2 (the device pixel ratio). :frowning_face:

6 
[Label.fontsize + ([screen1.width X screen1.hight] / a constant) ]

:question:

7

i came up with a formula where the ratio of the font size of any item in a list gets adjusted according to the screen size. all i need now is a block that could give me a list of all the components used specified by the component type.

something like this ,

get list of components used [type of component]  <-- 'Label' for an example

if there's anyone kind enough to make an extension on this or find a solution to get this list, it would be awesome :pray:

i made a small app using a formula that i created where 3 labels change their font size according to the phone your using. (read the comments)

tester.aia (184.6 KB)

8

You will need to make a list (or a list of each type of component) of components, so that you can then iterate over that list using the anyComponent blocks in order to change the font size.

9

yes, thats exactly what i should do, but in my case, ive created an app which has ALOT of labels and buttons, so its very impractical to list em all. isnt there another way to get this list without making it mannually?

10

Currently, there is no other way I am aware of, the components are created at runtime. But you only have to set it up the once.

perhaps look at how you can reduce this number of components in your app workflow...is there ALOT of replication/duplication? Could you reuse a display ?

11

Nope, its too much :frowning_face:. there are about 140 labels ONLY and 3647 blocks. impossible :sweat: :sob:

12

@TIMAI2 what do you suggest i do? :frowning_face: is there anyone there willing to make an extension on this?