android - 推送到新屏幕后底部导航栏未隐藏

Question

我有两个屏幕A和B，屏幕A有一个底部导航栏。

当我将屏幕 A 推到屏幕 B 后，屏幕 A 的底部导航栏仍然固定在屏幕 B 上。

我想显示全屏 B，而不显示屏幕 A 的底部导航。

这是屏幕 A，它有一个底部导航栏:

class Parent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'TechOne',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: MyParentPage(title: 'TechOne'),
    );
  }
}

/*StatefulWidget is Widget with mutable*/
class MyParentPage extends StatefulWidget {
  MyParentPage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyParentPageState createState() => _MyParentPageState();
}

/*State is a manager of StatefulWidget*/
class _MyParentPageState extends State<MyParentPage>
    with SingleTickerProviderStateMixin {
  var _itemSelected = 0;
  TabController _tabController;

  final _bodyUI = [
    HomeUI(),
    SearchUI(),
    Center(
      child: Text('Notification'),
    ),
    Center(
      child: Text('Account'),
    ),
  ];

  _onBottomNavigationBarTap(int index) {
    print(_itemSelected);
    setState(() {
      _itemSelected = index;
    });
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _tabController = TabController(length: 4, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    _tabController.animateTo(_itemSelected);

    return Scaffold(
        bottomNavigationBar: BottomNavigationBar(
          items: Values.itemsBottomNavigationBar,
          onTap: (index) {
            _onBottomNavigationBarTap(index);
          },
          currentIndex: _itemSelected,
          selectedItemColor: Colors.red,
          backgroundColor: Colors.white,
          type: BottomNavigationBarType.fixed,
        ),
        body: TabBarView(
            physics: NeverScrollableScrollPhysics(),
            controller: _tabController,
            children: <Widget>[
              _bodyUI[0],
              _bodyUI[0],
              _bodyUI[2],
              _bodyUI[3],
            ]));
  }
}

在 _bodyUI[0] 小部件内，我推送到屏幕 B:

Navigator.push(context, MaterialPageRoute(builder: (context) => SearchUI()));

这是屏幕B，底部导航栏仍然固定在此处，我想隐藏它:

class SearchUI extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title: 'Search',
      theme: ThemeData(primarySwatch: Colors.red),
      home: MySearchPage(),
    );
  }
}

class MySearchPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _MySearchState();
  }
}

class _MySearchState extends State<MySearchPage> {
  final TextEditingController _textEditingController = TextEditingController();
  final FocusNode _focusNode = FocusNode();

  TextField _appBarTitle;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    _appBarTitle = TextField(
        controller: _textEditingController,
        focusNode: _focusNode,
        autofocus: true,
        textInputAction: TextInputAction.done,
        textCapitalization: TextCapitalization.sentences,
        cursorColor: Colors.white,
        cursorRadius: Radius.circular(16),
        maxLines: 1,
        style: TextStyle(
          color: Colors.white,
        ),
        decoration: InputDecoration(
            border: InputBorder.none,
            prefixIcon: Icon(
              Icons.search,
              color: Colors.white,
            ),
            suffixIcon: IconButton(icon: Icon(Icons.clear, color: Colors.white,), onPressed: (){
              _textEditingController.clear();
            }),
            hintText: 'Search...',
            hintStyle:
                TextStyle(color: Colors.white.withOpacity(0.5), fontSize: 18)));
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: _appBarTitle,
      ),
      body: Center(
        child: Text('Search Screen'),
      ),
    );
  }
}

Answer 1

您的代码正在调用 SearchUI() 类作为 TabBarViews 之一:

 final _bodyUI = [
    HomeUI(),
    SearchUI(),
    Center(
      child: Text('Notification'),
    ),
    Center(
      child: Text('Account'),
    ),
  ];

这意味着它只会改变 View 并将栏保留在​​那里。

编辑:在我之前删除的评论中，我提到嵌套的 MaterialApps 可能会导致问题。这似乎有助于纠正问题，但在下面的评论中，您现在提到添加后退箭头。下面的引用摘自 Flutter documentation for AppBar 。

If the leading widget is omitted, but the AppBar is in a Scaffold with a Drawer, then a button will be inserted to open the drawer. Otherwise, if the nearest Navigator has any previous routes, a BackButton is inserted instead. This behavior can be turned off by setting the automaticallyImplyLeading to false. In that case a null leading widget will result in the middle/title widget stretching to start.

基本上，您可以使用上述属性关闭该功能。