I’ve finally figured out the magic combination that makes my custom elements properly fill space in the screen. (For reference I’m working on a Typeform plugin)
I add my component to a 1-item group, then I can set the group styles to Fixed Top or Bottom (anything but Fixed None works). This allows my element to fill the screen properly without limitations. My app uses both the App bar and Tab bar, and this is the only thing that’s worked to make my plugin fill the entire space between the two bars on all screen sizes.
This is due to some weirdness with Adalo’s screen rendering where standard components and fixed components are all rendered within the same group of elements, but single custom components are rendered on a different layer making it impossible to size them to fill the remaining space when Adalo doesn’t do so automatically.
Edit: After much testing, this doesn’t apply every time in the Previewer. I’m getting luck with selecting Bring To Front on my App Bar, Tab Bar, and custom component, and grouping and ungrouping my custom component, but Adalo is adding extra
div elements around my custom component sometimes. Once it locks in it seems to render correctly consistently until you make changes. Then it’s a guessing game again.