Layout jump when hiding a component

I’m building an app in Adalo and have a layout issue.

I have an “Inbox” screen.

When the user has 0 messages, I show an empty state section at the top:

  • “Your locker is empty”
  • Invite button
  • Some explanatory text

When the user has 1 or more messages, that entire empty state section is hidden.

The problem is that when the empty state is hidden, I’m left with a large blank space at the top of the screen before the message list starts.

It seems like Adalo is hiding the component, but not collapsing the space it occupied.

What’s the best way to handle this in Adalo?

Hi @Yuki.O,

You figured this out? I would suggest you to watch below videos!

  1. https://youtu.be/-2JCE1cPZdE (Recorded by Kyle Belford from Adalo Team)
  2. https://youtu.be/mfI6RjBYd-c, https://youtu.be/Vk3GFTytc7A (Recorded by @Victor)

Thank you and have a great day!

Solved. Thank you so much @Dilon!