Hi everyone!
I’ve been playing with Adalo for a while and I don’t fully understand how the autolayout work with different items. Sometimes I have a text and an icon side by side, in some screens it looks good but in some other (the smaller ones), the text gets on top of the icon. If I select the auto-width featured, it doesn’t work either, as the text gets too small:
The only solution I found is to play with the size of the text and try different widths while simultaneously check it on devices with different screen sizes, but as you can imagine, it takes some time.
I’ve been having some trouble with the sometimes visible feature too. When I put two icons side by side, and I put both of them sometimes visible, it works perfectly, when one of them is visible and the other is not, the icon who is visible stays in the same position, and the same way the other way around, (as you can see in the picture above, both the pink lighting and the gray lighting appear in the same positioning, keeping the same layout of the group). But if only one of them is sometimes visible and the other is always visible, then the layout breaks down:
In this case, there is one gray square who is always visible and a pink one who is sometimes visible. I followed this expandable menu kit so that when you click on the gray square (the non-expandable menu), the pink square appears on top of the gray one (The expandable menu). But as you can see, the layout breaks, as you can see both squares. The interesting part is that this only happens sometimes, it only happens when you have a conditional component (ex: conditional text, or an icon which is sometimes visible, etc.).
Can anyone explain to me why these bugs happen and how to fix them? I know that it may not be bugs but me who doesn’t fully understand how Adalo layout different components together, so please any explanation will help me.
Thank you!!