嵌套的 BottomNavigationBar 导致重复的 appBar

Question

我有一个嵌套的 BottomNavigationBar，它允许我在每个项目中创建一个堆栈。这允许我弹出回到堆栈中的原始页面。但是在推送到另一个页面后 appBar 被复制了。如果我删除原来的 appBar，我将在着陆页上没有 appBar。如果我删除目的地 appBar 我会失去弹回的箭头。

所以我想我应该尝试；

在推送到时以编程方式删除第一个 appBar 目标页面，
删除目标 appBar 并以某种方式获得原始 appBar 继承目标 appBar.

这两种方法是否明智？如果是这样，最好的方法是什么？或者我应该采用完全不同的方法吗？有没有办法同时拥有永久 BottomnavigationBar 和 appBar？

这是包含嵌套 BottomNavigationBar;

的主要代码

class TabsScreen extends StatefulWidget {
  @override
  _TabsScreenState createState() => _TabsScreenState();
}

class _TabsScreenState extends State<TabsScreen> {
  int _currentIndex = 0;
  final _home = GlobalKey<NavigatorState>();
  final _messages = GlobalKey<NavigatorState>();

  @override
  Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
      //some stuff
       ),
      body: IndexedStack(
        index: _currentIndex,
        children: <Widget>[
          Navigator(
            key: _home,
            onGenerateRoute: (route) => MaterialPageRoute(
              settings: route,
              builder: (context) => MainPage(),
            ),
          ),
          Navigator(
            key: _messages,
            onGenerateRoute: (route) => MaterialPageRoute(
              settings: route,
              builder: (context) => Messages(),
            ),
          ),     
          ),     
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        currentIndex: _currentIndex,
        onTap: (val) => _onTap(val, context),
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('Home'),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.message),
            title: Text('Messages'),
          ),          
        ],
      ),
    );
  }

  void _onTap(int val, BuildContext context) {
    if (_currentIndex == val) {
      switch (val) {
        case 0:
          _home.currentState.popUntil((route) => route.isFirst);
          break;
        case 1:
          _messages.currentState.popUntil((route) => route.isFirst);
          break;        
        default:
      }
    } else {
      if (mounted) {
        setState(() {
          _currentIndex = val;
        });
      }
    }
  }
}

这是推送到目标页面的代码；

  onSwipeUp: () {
              Navigator.push(
              context,
              PageTransition(
                type: PageTransitionType.downToUp,
                child: HomeReply(),
              )
          );
        },

这是目的地代码：

class HomeReply extends StatefulWidget {
  @override
  _HomeReplyState createState() => new _HomeReplyState();
}

class _HomeReplyState extends State<HomeReply> {

  @override
  void initState(){}

  @override
  Widget build(BuildContext context) {
    return
           Scaffold(
                appBar: AppBar(
                    title: Text(
                      "Back to " + "'" + originalTitle + "'",
                    ),
                  ),
                body: ReplyStage(),          
       );
  }
}

Answer 1

我最终使用了一种完全不同的方法，使用 Flutters Nested Navigators 插件；

https://github.com/n0vah/nested_navigators

嵌套的 BottomNavigationBar 导致重复的 appBar

Nested BottomNavigationBar results in Duplicate appBar

dart

flutter

bottomnavigationview