Button being covered by tab bar

This is what I have in the design screen. A logout button and a tab bar at the button.

Now when I preview there is so much white space on top and the logout button gets covered by the tab bar.


What is going on here?

Hi @trble ,

Try group it and at group, click edit style, make it Bottom.

I don’t want the logout button floating on the screen though so i dont want to fix it to the bottom. I tried grouping it with other objects but the result is always the same. it gets covered by the bottom tab.

Another idea, put rectangle between tab bar and button, experiment with their height.

Ok this was able to pusht he button into visibility. But i dont understand why there is a huge white gap between the list and the button (above the button)

It looks like the edge of components matter, if a visibility is applied we need to put a rectangle on top of it to hold the position, otherwise it will be pushed up.

The same concept for bottom part, it needs to know where is the distance from bottom edge of screen to the bottom edge of component, rectangle is the most obvious measurement to tell the engine.

It needs to know how we put distance between each other components.

Yea i tried a small rectangle above too. For some reason adalo still keeps putting a huge white gap above the button. At least its visible now though.