Help with creating tabs in footer element

Need help
1

Does anyone know how to create this in bubble on the footer element? I am creating a native mobile app

2

did you discover a solution?

3

I do this by showing a top border on an element and custom states (but it could also be done using shapes; it just may be a little more time consuming). Here is a forum example:

Preview:

Editor:

1 Like
4

if this is the menu, you can use a floating group
Is this what you are trying to achieve? https://bookingapp.bubbleapps.io/version-test/mclient
Each element menu color (icon or text) can be changed based on states.

1 Like
5

Going to that url is protected by a password.

6

sorry.
user: claudiu88
pass: claudiu88

7

I’m sorry. I think the login expired.

8

@fayewatson

Do you know how to make an icon or button in a footer act as a navigation back to a group?

I have a SPA with several groups that are visible through a custom state. I use buttons to go/show a group and button to get go back to the “home” page. But when a user scrolls down I would like the user to have a icon/button in the footer they can hit to go back to the home page. I don’t seem to be able to access the custom state (from the footer) on the home page that navigates the groups. And can seem to formulate a connection. Any thoughts?

9

Hi @proust007 :slight_smile: Is the custom state set on an element within the reusable element or the reusable element itself? It’s a little tricky, but in order to access a reusable element’s custom state on a page, the custom state needs to be set within the reusable element editor, on the entire reusable element itself. For example, if the reusable element’s name is “footer”, then navigate to that reusable element in the editor, and create the custom state on the “footer”. The workflow for the custom state inside the footer would be:

“When Back Arrow is clicked” -->
Set the footer’s[custom state] to “yes”

Then, back on the page itself, you will be able to a create workflow such as:

“Do When Condition is True” (Every Time)
Reusable element footer A’s [custom state] is “yes” —>

  1. Hide the current Group
  2. Show the Home Group
  3. Set the Reusable element Footer’s [custom state] back to “no”.

Note: If you have multiple footer reusable elements on the page, a “Do When Condition is True” workflow event is needed for each reusable footer. So they would be:

“Do When Condition is True” (Every Time)
Reusable element footer A’s [custom state] is “yes” —>
[Necessary Workflows]

“Do When Condition is True” (Every Time)
Reusable element footer B’s [custom state] is “yes” —>
[Necessary Workflows]

“Do When Condition is True” (Every Time)
Reusable element footer C’s [custom state] is “yes” —>
[Necessary Workflows]

A little tedious, but that should do the trick! :slight_smile: Feel free to let me know if you have any questions!

1 Like
10

Thank You! I will give this a go and see if I can get it worked out. I did try to do this off a group inside of the reusable element and not the reusable element (footer) itself. I didn’t think just do that…

1 Like