Member-only story

Build a game with only Flutter BottomNavigationBar

Don’t get fooled by the widget name, it’s only a UI, but it’s still awesome.

Jackson Zhou
5 min readOct 14, 2019

The bottom navigation bar looks like this

Too often a tutorial starts without getting definitions out of the way. In this post, we are going to take about the bottom navigation bar, and it looks something like this (you must have seen quite a few lol):

What is a bottom navigation bar? It looks like this.

A bottom navigation bar is more intuitive than page navigation (for the users)

Why do we want to use the bottom navigation bar out of all other options for navigation? To me, the advantage is that it is more intuitive to the users (good to know current location while navigating), the cons are: it takes screen real estate and in some frameworks, it is harder to have a clean implementation.

In Flutter, the bottom navigation is not a navigation

It might sound counter-intuitive, but (unlike React Native) the bottom navigation in Flutter is nothing more than a dumb widget (a UI, or a few buttons) that simply renders the UI widgets supplied to it. As for navigation, you will need to do it yourself.

Enough for the…

--

--

No responses yet