Flutter 导航到其他页面中的特定选项卡

Question

我试图从一个页面导航到另一个页面并设置标签栏的索引。

这是我在第一页的代码:

GestureDetector(
onTap: () { Navigator.push(
context,
MaterialPageRoute(builder: (context) => ProductPage()),
); },
child: Container(
color: Colors.blueGrey,
)),

在另一个页面(ProductPage)中:

class ProductPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
return DefaultTabController(
    length: 3,
    child: Scaffold(
      appBar: AppBar(
    backgroundColor: Color.fromRGBO(65,102,60,1,
    ),
        bottom: TabBar(
          isScrollable: true,
          indicatorColor: Colors.white,
          tabs: [
            Tab(icon: Text('First')),
            Tab(icon: Text('Second')),
            Tab(icon: Text('Third')),
          ],
        ),
      ),
      body: TabBarView(
        children: [
          FirstTab(),
          SecondTab(),
          ThirdTab(),
        ],
      ),
    ),
);
  }
}

现在它总是打开第一个选项卡，但我希望它打开 SecondTab。

我试过这个:

MaterialPageRoute(builder: (context) => ProductPage(SecondTab)),

但它不起作用。我该怎么做才能解决这个问题？

Answer 1

您可以将索引作为参数传递，然后在 defaultTabController 的初始索引中使用它。

尝试这样的事情:

GestureDetector(
    onTap: () { Navigator.push(context,
        MaterialPageRoute(builder: (context) => ProductPage(0))); 
    },
    child: Container(color: Colors.blueGrey)
)

在另一个页面(ProductPage)中:

class ProductPage extends StatelessWidget {
  int selectedPage;
  ProductPage(this.selectedPage);

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      initialIndex:selectedPage,
      length: 3,
      child: Scaffold(
        appBar: AppBar(
          backgroundColor: Color.fromRGBO(65,102,60,1),
        ),
        bottom: TabBar(
          isScrollable: true,
          indicatorColor: Colors.white,
          tabs: [
            Tab(icon: Text('First')),
            Tab(icon: Text('Second')),
            Tab(icon: Text('Third')),
          ],
        ),
        body: TabBarView(
          children: [
            FirstTab(),
            SecondTab(),
            ThirdTab(),
          ],
        ),
      ),
    );
  }
}

现在您可以将 0,1 或 2 作为选定索引传递。