Трепетание всплывающее в корень при нажатии нижней навигации

Question

Я хочу реализовать функцию, которая, когда пользователь нажимает BottomNavigationBarItem, попадает в корень, если индекс текущей страницы равен индексу постукивания, как обычное приложение для iOS. Я попробовал как ниже. Я установил маршрут для всех корневых страниц в MaterialApp и в HomeScreen, если currentIndex равно index, popUntil для корневой страницы. Однако ошибка говорит

flutter: при обработке жеста возникла следующая ошибка StateError:
флаттер: плохое состояние: будущее уже завершено

Как я мог заставить эту работу?

Код:

// MyApp class 
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          routes: <String, WidgetBuilder>{
            '/Page1': (BuildContext context) => new Page1(),
            '/Page2': (BuildContext context) => new Page2(),
            '/Page3': (BuildContext context) => new Page3(),
            '/Page4': (BuildContext context) => new Page4(),
          },
          title: 'Flutter Example',
          home: new HomeScreen(),
        );
      }
    }


  // MyHome class
    class HomeScreen extends StatefulWidget {
      @override
      _HomeScreenState createState() => new _HomeScreenState();
    }

    class _HomeScreenState extends State<HomeScreen> {
      final List<StatelessWidget> pages = [
        new Page1(),
        new Page2(),
        new Page3(),
        new Page3(),
      ];
      final List<String> routes = [
        '/Page1',
        '/Page2',
        '/Page3',
        '/Page4',
      ];

      int currentIndex = 0;

      @override
      Widget build(BuildContext context) {
        return new WillPopScope(
          onWillPop: () => new Future<bool>.value(true),
          child: new CupertinoTabScaffold(
            tabBar: new CupertinoTabBar(
              onTap: (index) {
                if (index == currentIndex) {
                  Navigator.popUntil(context, ModalRoute.withName(routes[index]));
                }
                currentIndex = index;
              },
              backgroundColor: Colors.white,
              activeColor: Colors.blue,
              inactiveColor: Colors.grey,
              items: const <BottomNavigationBarItem>[
                BottomNavigationBarItem(
                  icon: Icon(Icons.looks_one),
                  title: Text('Page1'),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.looks_two),
                  title: Text('Page2'),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.looks_3),
                  title: Text('Page3'),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.looks_4),
                  title: Text('Page4'),
                ),
              ],
            ),
            tabBuilder: (BuildContext context, int index) {
              return new DefaultTextStyle(
                style: const TextStyle(
                  fontFamily: '.SF UI Text',
                  fontSize: 17.0,
                  color: CupertinoColors.black,
                ),
                child: new CupertinoTabView(
                  builder: (BuildContext context) {
                    return pages[index];
                  },
                ),
              );
            },
          ),
        );
      }
    }

Answer 1

Теперь возможно достигнуть этого поведения, так как Flutter v1.1.1, который добавил navigatorKey к CupertinoTabView (https://github.com/flutter/flutter/commit/65df90d8b5e1145e1022c365bb0465aa8c30dcdf)

Сначала вы должны объявить один GlobalKey<NavigatorState> на вкладку, а затем передать его соответствующей CupertinoTabView конструкторов. Затем, в методе onTap вашего CupertinoTabBar, вы можете и получить root с помощью firstTabNavKey.currentState.popUntil((r) => r.isFirst), если пользователь нажимает, оставаясь на той же вкладке.

Полный пример ниже:

void main() {
  runApp(MyApp());
}
class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
  int currentIndex = 0;

  final GlobalKey<NavigatorState> firstTabNavKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> secondTabNavKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> thirdTabNavKey = GlobalKey<NavigatorState>();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My App',
      home: CupertinoTabScaffold(
        tabBuilder: (BuildContext context, int index) {
          switch (index) {
            case 0:
              return CupertinoTabView(
                navigatorKey: firstTabNavKey,
                builder: (BuildContext context) => FirstTab(),
              );
              break;
            case 1:
              return CupertinoTabView(
                navigatorKey: secondTabNavKey,
                builder: (BuildContext context) => SecondTab(),
              );
              break;
            case 2:
              return CupertinoTabView(
                navigatorKey: thirdTabNavKey,
                builder: (BuildContext context) => ThirdTab(),
              );
              break;
          }
          return null;
        },
        tabBar: CupertinoTabBar(
          items: <BottomNavigationBarItem> [
            BottomNavigationBarItem(
              title: Text('Tab 1'),
            ),
            BottomNavigationBarItem(
              title: Text('Tab 2'),
            ),
            BottomNavigationBarItem(
              title: Text('Tab 3'),
            ),
          ],
          onTap: (index){
            // back home only if not switching tab
            if(currentIndex == index) {
              switch (index) {
                case 0:
                  firstTabNavKey.currentState.popUntil((r) => r.isFirst);
                  break;
                case 1:
                  secondTabNavKey.currentState.popUntil((r) => r.isFirst);
                  break;
                case 2:
                  thirdTabNavKey.currentState.popUntil((r) => r.isFirst);
                  break;
              }
            }
            currentIndex = index;
          },
        ),
      ),
    );
  }
}

Answer 2

вы можете добиться того же эффекта с помощью pushAndRemoveUntil (если я правильно понимаю ваши потребности).

final PageRouteBuilder _homeRoute = new PageRouteBuilder(
  pageBuilder: (BuildContext context, _, __) {
    return HomeScreen();
  }, 
);

void _goHome() {
  Navigator.pushAndRemoveUntil(context, _homeRoute, (Route<dynamic> r) => false);
}

это дает дополнительное преимущество возможности использования других свойств PageRouteBuilder.