Home Articles

如何使用多个导航器

Asked
Viewed 97 times
1

我目前在我的颤动应用程序中有一个 MaterialApp ,这使得 Navigator 的使用非常简单,这很棒 . 但是,我有一个自定义标签栏,其中包含另一个小部件/视图 . 我'd now like that widget/view to have it'自己的导航堆栈 . 所以我的目标是将标签栏保持在顶部,同时从我的小部件/视图中导航到其他页面 .
这个问题几乎就是这样的:Permanent view with navigation bar in Flutter但是在那段代码中,还没有 MaterialApp . 嵌套 MaterialApp 给出了时髦的结果,我不相信那会是一个解决方案 .

enter image description here

有任何想法吗?

1 Answer

  • 2

    您可以为每个页面创建新的Navigator . 作为参考检查CupertinoTabView

    或简单的例子:

    import 'package:flutter/material.dart';
    
    class Home extends StatelessWidget {
      Navigator _getNavigator(BuildContext context) {
        return new Navigator(
          onGenerateRoute: (RouteSettings settings) {
            return new MaterialPageRoute(builder: (context) {
              return new Center(
                child: new Column(
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    new Text(settings.name),
                    new FlatButton(
                      onPressed: () =>
                          Navigator.pushNamed(context, "${settings.name}/next"),
                      child: new Text('Next'),
                    ),
                    new FlatButton(
                      onPressed: () =>
                          Navigator.pop(context),
                      child: new Text('Back'),
                    ),
                  ],
                ),
              );
            });
          },
        );
      }
    
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          body: new Column(
            children: <Widget>[
              new Expanded(
                child: _getNavigator(context),
              ),
              new Expanded(
                child: _getNavigator(context),
              ),
            ],
          ),
        );
      }
    }
    
    void main() {
      runApp(new MaterialApp(
        home: new Home(),
      ));
    }
    

    Screenshot

Related