DEV Community

ZhiHong Chua
ZhiHong Chua

Posted on

[Stack] The Heart of APP Navigation

Image description

Developing an APP with many pages can sometimes get confusing, so today I explored some fundamentals. How does app navigation work? Like a stack of pancakes. Yes, the data structure stack, which is Last In First Out (LIFO). In non-technical terms, it just means that you can only remove the latest item added to the stack, each time (so no sliding out a pancake from underneath the rest).

Image description

No really, please don't

It seems both React Native and Flutter uses the same stack navigation.

What does this mean?

It means that in APP, homepage is the bottom-most page (or ‘pancake’). Everything else is built upon it, and at each time you can only view / interact with the topmost page. To return to homepage, you can pop() pages off, or even just pop all with popToTop().

Protecting the stack

Disable gestures. Gestures are like swipe, or triple tap. Different phones / OEMs come with different variations. So disabling it ensures more stability of usage.

Top comments (0)