How to create a floating header and floating footer in a mobile app?

Need help
1

Hello Bubblers,

I have been trying to create a floating header and floating footer for a mobile app. The main issue I am having is being able to group all of the contents of one screen (floating header, floating footer and the elements) so that I can show/hide them as a group. The three main options I’ve tried are below: stripes, grouping all the elements, and using a group on the page.

Three options I have tried so far:

  • Stripes at the top and bottom: this isn’t possible because with a mobile app, we are using just the index page. As some screens won’t have a header/footer, it doesn’t make sense to use stripes.

  • Floating groups: this isn’t possible because we cannot group the floating group header and floating group footer with any other elements on the page. The option to “group elements into a group” doesn’t come up when I right click. Therefore, we cannot show/hide the entire group.

  • Making the entire screen a “group” and then placing both the floating header and floating footer into it: this completely remove the ability of the floating group, as they move with the other elements as one whole group.

Is there something I am missing?

2

I am running into a similar issue. I have added floating groups inside of individual groups. However, once text causes the group to expand, the floating groups don’t float relative to the top or bottom.

Is this just an issue with the previewer, or do I need to place each floating group on the index page outside of each page (group), and set a conditional so the floating groups are visible when the appropriate page is visible?

3

Sorry mate, I have no solution for this.

Anybody else?

4

Placing floating groups inside groups doesn’t work, they can’t float. You can place groups in floating groups and place elements in them.

It will be easier to assist with a link.

1 Like