page: https://bubbletestapp.bubbleapps.io/version-test?debug_mode=true
editor: https://bubble.io/page?name=index&id=bubbletestapp&tab=tabs-1
It appears that groups don’t collapse properly if they are stacked over one another.
In the link you can see that if both Group A and Group B are hidden, the collapse is only to the height of Group A but not Group B …
Posting here since I think its a bug / unexpected behavior but not fully sure
cc @emmanuel
You get weird collapsing issues depending on where the responsive engine gets the reference positioning points from nearby elements etc.
This means you have to be careful where you place elements, and and to possible include groups within groups etc.
See my collapse demo here: https://dave-auld-demo-stuff.bubbleapps.io/group_collapse_demo
Stacking groups always works fine. The wierd behavior is is when groups are over one another and hidden.
Can confirm that this is an issue for all users.
Morning,
As I said in the post, it is to do with how the engine using the the positioning of reference points. You need to manipulate this to make it work.
I have got your example working by grouping buttons and message and then adding a transparent group between the A Group and the Buttons. This new Group is also hidden when Group B is hidden, and it set to collapse its height when hidden. Now the whole lot move up correctly
I added a note to your demo which states:
“DaveA Says: This problem is fixed by using a transparent group to act as the reference ‘edge’ this is overlayed with the Group B and hidden when Group B is hidden.”
You will find you also need to using things like transparent shapes with 0 minimum size, to act as spacers when using the responsive engine to get layouts to work as expected under certain circumstances.
What i tend to do is leave the shapes coloured while developing, and then when happy how the page works, make the shapes background color none.
Hope this helps!
This topic was automatically closed after 14 days. New replies are no longer allowed.
