Flutter: Use Navigator with TabBar and TabBarView

Question

I'm trying to understand the class Navigator.

A Navigator Route seem to always return a new widget but what if I want to manage the TabBar and TabBarView so that each Tab when tapped or swipe on, will be pushed to the Navigator stack, I don't find a what to do that.

On a more general case, can I react to a route change without creating a new widget but instead taking another action like scrolling to a specific item in a listView ?

I've tried recreating the entire app structure every time but doing this way I don't have the nice default animation and, also, doesn't seem a good approach to me.

Answer 1

You can use WillPopScope widget and its onWillPop to catch the back button pressure and handle it yourself. Find more info here https://docs.flutter.io/flutter/widgets/WillPopScope-class.html

On a more general case, can I react to a route change without creating a new widget but instead taking another action like scrolling to a specific item in a listView?

This looks more specific rather than general. However, you do need to set a ScrollController in your ListView and let it scroll the list for you to the desired point. A simple example function returning to top:

class MyFancyClass extends StatelessWidget{
...
ScrollController _scrollController;
...
@override
Widget build(BuildContext Context){
  return ....
  new ListView(
    ...
    controller: _scrollController,
    ...
}

void _toTop() {
  _scrollController.animateTo(
    0.0,
    duration: const Duration(milliseconds: 500),
    curve: Curves.ease,
  );
}

Check https://docs.flutter.io/flutter/widgets/ScrollController-class.html for more details and behaviors. In case you want the back button to bring you to the top:

Widget build(BuildContext context) {
  return new WillPopScope(
    onWillPop: _onTop,
    child: 
      ...
    ),
  );
}

Concerning the tab behavior I suggest you to read https://docs.flutter.io/flutter/material/TabController-class.html to better understand how to implement what you have in your mind.