Skip to content
Videos
Video

How to Build a Bottom Navigation Bar with Nested Routes Using Flutter Go Router

by HeyFlutter․com youtube.com

5 min 21.1k views

Learn how to implement a sleek bottom navigation bar with nested routes in your Flutter app using the Go Router package. This tutorial covers: - Setting up Go Router in your project - Creating a bottom navigation bar layout - Implementing nested routes for each tab - Handling navigation state and deep linking Perfect for Flutter developers looking to enhance their app's navigation structure. Code along to build a professional, scalable navigation system in just a few minutes! Timeline 00:00 Intro 00:06 Installing Go Router 00:10 Creating the Go Router Instance 00:26 Using the StatefulShellRoute 00:58 Creating the Layout Scaffold 01:22 Adding the Bottom Navigation Bar 02:05 Adding the Branches to the Router 02:32 Initializing the Go Router instance 02:51 Adding a Nested Shell Route 03:42 Passing Data to a Nested Shell Route Also Checkout : 👉 Join 12-Week Flutter Training: https://heyflutter.com 👉 Check out the Source Code: https://github.com/HeyFlutter-Public/nested-routes-using-go-router 👉Join the WhatsApp Channel to get the latest news about Flutter & HeyFlutter: https://www.whatsapp.com/channel/0029VaDNCZtC1Fu8nL2vmw3f

Forum

Questions about this, or something to add?

Discuss on the forum

Topics Navigation and routing

Report this · Wrote this? Claim it

Supported by