Anyone understand Adalo's page rendering rules?

Is there any resource you’ve found that explains the rules Adalo uses to render elements on a page? Or does anyone have a strong enough handle on how it works to be able to teach it clearly? There is some logic akin to the CSS box model at work behind the scenes that I don’t understand. I checked the Adalo videos section and didn’t see anything on this topic nor anything on Makerpad. This is training I would pay for right now.

Getting things to line up is usually a matter of a bunch of trial & error tweaking & moving things around, previewing, playing with 100% opacity rectangle containers, centering and left aligning elements until everything eventually looks acceptable but the process is haphazard and not deterministic. And it’s never exactly right. I’m shooting in the dark to get it to render acceptably and it’s a tedious/frustrating process of tinkering. Once it eventually looks okay I’m afraid to touch anything because it’s like a jenga stack where one move brings all of it crashing down if your Ctrl-Z fails in that situation to undo your way out of it you then start over at square one.

I would love to see a tutorial by someone who understands exactly the rendering logic Adalo uses to draw the page talk through how it works to demystify the rendering sorcery. thanks

3 Likes

I’m dealing with the same issue. For the last couple of days I’ve been trying to get things to look “acceptable” on different devices. For me specifically it’s the webview component that is a headache. Works great on the smaller devices, won’t scroll on the bigger devices … no matter what I try. For me I have other components looking acceptable … so far.

Yea the webview one has a mind of its own sometimes but I’m just using vanilla forms, lists, text and images on the page and anything where there are multiple columns and rows of stuff is always a crapshoot to get it to look right. Would be huge if someone who actually knows the algorithm it’s using to render could just explain the ruleset.

I agree. I haven’t dove in as much as you yet. Using the forms, simple lists, and custom lists, I often find myself having to use invisible buttons to get space between them so the layout looks presentable on multiple devices.

Hi there,

Anything new regarding the issue?
It’s terrible to work on UI and get final rendering totally messed up.

Thanks in advance for the update! :slight_smile: