bottom_tabs

Package	Kind	Provides the role	Needs	Choose with
smf_bottom_tabs	layout	Layout	a router	-m bottom_tabs

bottom_tabs shows the main navigation of the app as tabs in a bar at the bottom. Features declare which of their routes are destinations of the main navigation, each with a label and an icon, such as Home with the home icon, and this module generates the widget around them.

What it adds to the app

The module adds lib/core/layout/app_shell.dart with AppShell, a Scaffold whose body is the screen of the selected destination. At the bottom it has a Material 3 NavigationBar with a tab for each destination, showing its icon and label. With a single destination there is nothing to switch to, so the bar is hidden and the screen fills the app.

The layout role adds lib/core/layout/destination.dart with Destination, the label and the icon of an item, whichever module provides the layout.

How the router uses it

The module that provides the router builds the main navigation around the shell, with a branch for each destination in the order of the features. Each branch keeps its stack while another tab is selected. The app opens on the tab of its start screen, and an app without destinations has no main navigation. See Navigation.

Limits

The bar shows at most five destinations, as the Material Design guidelines advise. A feature whose destination does not fit is left out of the app with a warning, and with --strict, smf create stops instead.

Choosing it

smf create asks which module provides the layout before it asks about the router, and offers None as well. To choose it without the question:

smf create my_app -m home,bottom_tabs

The layout requires a router, which smf create adds when only one module provides it.