在导航到下一个选项卡之前显示消息对话框

Question

我有一个 TabBarView()，我需要显示一个 MessageDialog (showDialog) 询问是否真的要离开这个选项卡。有什么办法吗？

这是我的代码主体

child: Scaffold(
        drawer: SideMenu(),
        appBar: AppBar(
          title: Text("Antecedentes"),
          bottom: TabBar(
            isScrollable: true,
            controller: _controller,
            tabs: [
              Tab(text: 'Tab # 1'),
              Tab(text: 'Tab # 2'),
              Tab(text: 'Tab # 3'),

          ),
        ),
        body: TabBarView(
          controller: _controller,
          children: [
            TabOnePage(),
            TabTwoPage(),
            TabThreePage(),

          ],
        ),
      ),

我使用的是 Flutter 2.2.3 版本。 感谢您对此的帮助。

Answer 1

在Tabbar onTap 操作上显示AlertDialog，并将TabBar 索引设置为前一个（这将允许TabBar 保持在同一个选项卡上）：

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Tabbar Demo"),
          bottom: TabBar(
            onTap: (index) {
              print(index);
              showAlert(tabController.index);
              tabController.index = tabController.previousIndex;
            },
            unselectedLabelColor: Colors.white,
            labelColor: Colors.black,
            tabs: [
              Tab(icon: Icon(Icons.chat)),
              Tab(icon: Icon(Icons.drafts)),
              Tab(icon: Icon(Icons.ac_unit))
            ],
            controller: tabController,
            indicatorColor: Colors.black,
            indicatorSize: TabBarIndicatorSize.tab,
          ),
        ),
        body: TabBarView(
          children: <Widget>[
            CustomView("First"),
            CustomView("Second"),
            CustomView("Third"),
          ],
          controller: tabController,
        ));
  }

在 AlertDialog 中选择“确定”按钮后，将 Tabbar 索引设置为新索引。

  void showAlert(int newIndex) {
    AlertDialog alertDialog = new AlertDialog(
      content: new Container(
        height: 80.0,
        child: new Column(
          children: <Widget>[
            new Text("Want to leave this tab?"),
            new RaisedButton(
              child: new Text("OK"),
              onPressed: () {
                tabController.index = newIndex;
                Navigator.pop(context);
              },
            )
          ],
        ),
      ),
    );
    showDialog(context: context, child: alertDialog);
  }