Facing issue in screen over lapping

Hi , everyone, I am facing issue of screen overlapping. I am creating app and use single page and create multiple screens. and using the set state function to change the screen when click. But when I click on multi screen , instead of hiding the screen that is clicked all are showing and not hide. Please check the image and let me know where I am wrong.

You need to hide the other elements in the show element workflow.

I hide all the elements ,

You are talking about this right ?

No, he means creating a condition. Hiding the elements in the editor only hides them for you. My advice would be to take the Bubble lessons offered for free at bubble.io/lessons to learn more.

The approach to creating an SPA (single page application) with which I’m most familiar involves unchecking the “This element is visible on page load” setting for the various views/groups (i.e. making them all initially hidden) and then using conditionals to selectively unhide them (make them visible) when appropriate.

Additionally, potential layout issues can be avoided by vertically arranging the hidden groups representing the various “pages” of your app instead of overlapping them - i.e. “y-stack” instead of “z-stack” - as demonstrated here. (Click the button in the upper right to view the editor.)

EDIT: Just to clarify, by “conditionals” I mean the Conditionals tab of the properties editor.

1 Like

Thanks Shot , It really help me.

One more issue I want to share with you. If you can help me that out. —> I want the footer bar at bottom stick to any device it open. can you send me example of that , It will really help me lot. Thanks

This topic was automatically closed after 70 days. New replies are no longer allowed.