Best Practice for Mobile Navigation Menu at the bottom?

About the navigation menu.

We are planning to create a mobile app.
In the future, we would like to wrap it up with codeless academy and release the app.

The problem is the mobile navigation menu at the bottom.

We can and have done page transitions based on the state.
(You can set the options for the page and use setState to achieve the transition.)

On a single page, this is relatively easy to implement.
But with multiple pages, you’ll have to load the bottom navigation menu for every page move.

What are the best practices for navigation menus?
I’m curious to know how you have solved this problem.

PS


以前の実装方法

ページのカスタムステートを設定することで、状態遷移を実装しています。

この方法にはいくつか問題が有り

前のページに戻ることができない。
ページが進むにつれて複雑になる。

またページのカスタムステートに依存しているので、他のページを開いてしまうと状態遷移が上手くいかない。

例:homeからconfirmationページに移動したら、ナビゲーションメニューが機能しなくなる。

1 Like

Hi,

I am not sure how advanced you are with Bubble and maybe you already know this but you can use reusable elements.
Create a menu at the bottom using a reusable elements.
Then you can set states in it or use URLs to send information. Also using the condition “if current page name is X”

Note that for the reusable elements elements to communicate with rest of the page all states must be placed on the entire reusable element (so the outside one)

Hi! Thanks for the guidance!

A clarification please. I get that states must ALL be placed on the entire reusable element. But … I am not sure what you mean when you say > “so the outside one”. Could you please clarify?

hi, with entire reusable element I mean “the outside one”.
Outside as no group is further outside than the entire reusable element.

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