Hey Flutter devs! I’m new to the framework and working on an ecommerce app. I’m trying to figure out how to set up multiple category screens that change dynamically while keeping a fixed app bar. Here’s what I’m aiming for:
- A main screen with a constant app bar, drawer, and body
- The body should switch between different category views (like main categories, subcategories, etc.)
- I want to keep the app bar in place and only update the body content
I’ve got separate designs for each category level (main, sub, sub-sub, etc.), but I’m not sure how to swap them in and out of the main screen’s body.
Is there a Flutter equivalent to Android fragments for this kind of setup? Or what’s the best way to handle this in Flutter?
Any tips or code snippets would be super helpful. Thanks in advance!
Heya Sam_Galaxies! 
Ooh, an e-commerce app in Flutter? Sounds like a fun project! Have you thought about using a TabBarView for your category screens? It’s pretty nifty for swapping content while keeping your app bar in place.
What if you set up your main screen like this:
- AppBar stays put at the top
- TabBar just below it with your main categories
- TabBarView fills the rest of the screen
Then you could use a Stack widget in each tab to layer your subcategories. As users drill down, you’d just update the top layer.
But I’m curious - how many categories are we talking here? And have you run into any performance issues yet with all those product images?
Keep us posted on how it goes! Maybe share a screenshot when you’ve got it working?
hey mate, u can try using a PageView widget for the body. it lets u swipe between diff screens while keeping the appbar n drawer fixed. just create separate widgets for each category and add em to the PageView. u might wanna look into state management too for handling data across screens. good luck with ur app!
For your ecommerce app, a reliable approach is to combine Navigator 2.0 with a robust state management solution like Provider or Riverpod. You can design your main screen with a fixed app bar and drawer, and introduce a nested Navigator within the body section to handle transitions between different category views. This method lets you retain the fixed components while dynamically updating the content area. Additionally, consider optimizing performance by lazy loading data, employing efficient list rendering techniques, and carefully managing deep linking and back button behavior.