Question

我需要在标签栏视图的应用栏中添加后退按钮。

当您将选项卡视图控制器推到导航堆栈上时，我无法在选项卡菜单的应用程序栏中看到后退按钮。当我从左向右滑动时，我将转到上一屏幕，但无法在应用栏中看到后退按钮

以下是我将标签栏推入导航堆栈的方式

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


class TabBarScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.directions_transit)),
                Tab(icon: Icon(Icons.directions_bike)),
              ],
            ),
            title: Text('Tabs Demo'),
            automaticallyImplyLeading: true,

          ),
          body: TabBarView(
            children: [
              Icon(Icons.directions_car),
              Icon(Icons.directions_transit),
              Icon(Icons.directions_bike),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

因为您的TabBarScreen内部有一个MaterialApp，所以它有自己的Navigator和自己的导航堆栈。因此，就其角度而言，它位于“第一个屏幕”上。

如果您从小部件树中删除MaterialApp小部件，您将看到“后退”按钮。

这是我的意思：

class TabBarScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        appBar: AppBar(
          bottom: TabBar(
            tabs: [
              Tab(icon: Icon(Icons.directions_car)),
              Tab(icon: Icon(Icons.directions_transit)),
              Tab(icon: Icon(Icons.directions_bike)),
            ],
          ),
          title: Text('Tabs Demo'),
          automaticallyImplyLeading: true,
        ),
        body: TabBarView(
          children: [
            Icon(Icons.directions_car),
            Icon(Icons.directions_transit),
            Icon(Icons.directions_bike),
          ],
        ),
      ),
    );
  }
}

Answer 2

由于您没有使用此处链接的SELECT f.name, COUNT(distinct s.letters), AVG(t.numbers) ...，因此应该没有后退按钮，除非我误解了您的要求，否则我不明白您为什么想要一个。

https://api.flutter.dev/flutter/widgets/Navigator-class.html

Navigator不会更改页面，只会更改显示。您只在控制tabBarView的小部件。如果您希望有一个后退按钮，则需要在body中将iconButton硬编码为第二个/第三个屏幕，并使用该按钮appBar setState然后可以用与selectedIndex相同的方式在主体中交换小部件。

我不是专家，但我希望这对您有所帮助或为您指明正确的方向！

在Flutter的标签栏的应用栏中添加返回按钮

2 个答案: