默认选项卡控制器颤动

Question

我想问一下如何在 DefaultTab 中导航选项卡，我有 DefaultTabController 页面，我在 OrderList 中将其命名为 OrderList 我有 3 个不同的选项卡，当我单击按钮时，我想将其导航到显示取消页面的 OrderList .下面是我的代码。如果我直接导​​航到 OrderList，它将显示第一页，这是进度，我希望它导航到第三页，即取消页面。

class _OrderListState extends State<OrderList> {


  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Container(
        decoration: BoxDecoration(
          color: Colors.teal[300],
        ),
        child: Scaffold(
          bottomNavigationBar: BottomNavigationBarForAppClient(indexNum: 1),
          backgroundColor: Colors.transparent,
          appBar: AppBar(
            title: const Text('Order List'),
            centerTitle: true,
            flexibleSpace: Container(
              decoration: BoxDecoration(
                color: Colors.teal[300],
              ),
            ),
          ),
          body: Column(
            children: [
              TabBar(tabs: [
                Tab(
                  text: 'In Progress',
                ),
                Tab(
                  text: 'Completed',
                ),
                Tab(
                  text: 'Cancelled',
                ),
              ]),
              Expanded(
                child: TabBarView(children: [
                  ProgressClient(),
                  CompletedClient(),
                  CancelledClient(),
                ]),
              )
            ],
          ),
        ),
      ),
    );
  }
}

这是其他页面代码。正如你在这里看到的，我将它导航到 OrderList() 和 OrderList Progress Client 中的默认选项卡，我希望它转到 Canceled Client 选项卡

IconButton(
              onPressed: () {
                Navigator.pushReplacement(context,
                    MaterialPageRoute(builder: (context) => OrderList()));
              },
              icon: Icon(Icons.arrow_back, size: 40, color: Colors.white)),

Answer 1

class _OrderListState extends State<OrderList> with TickerProviderStateMixin {


    TabBar(
       controller: TabController(initialIndex: 3, vsync: this,length: 3)
       ..

添加控制器并设置 initialInde（你想要的页面索引）

Answer 2

尝试像推送一样使用路由参数

Navigator.pushReplacement(
    context,
    MaterialPageRoute(
        builder: (context) => OrderList(),
        settings: RouteSettings(arguments: 2)));

并在 orderList 上使用 TabController。

class OrderList extends StatefulWidget {
  const OrderList({super.key});

  @override
  State<OrderList> createState() => _OrderListState();
}

class _OrderListState extends State<OrderList>
    with SingleTickerProviderStateMixin {
  late final TabController controller = TabController(length: 3, vsync: this);
  @override
  Widget build(BuildContext context) {
    final int? callBackTabIndex =
        ModalRoute.of(context)?.settings.arguments as int?;
    if (callBackTabIndex != null && callBackTabIndex == 2) {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
        controller.animateTo(2);
      });
    }
    return Container(
      decoration: BoxDecoration(
        color: Colors.teal[300],
      ),
      child: Scaffold(
        // bottomNavigationBar: BottomNavigationBarForAppClient(indexNum: 1),
        backgroundColor: Colors.transparent,
        appBar: AppBar(
          title: const Text('Order List'),
          centerTitle: true,
          flexibleSpace: Container(
            decoration: BoxDecoration(
              color: Colors.teal[300],
            ),
          ),
        ),
        body: Column(
          children: [
            TabBar(
              controller: controller,
              tabs: [
                Tab(
                  text: 'In Progress',
                ),
                Tab(
                  text: 'Completed',
                ),
                Tab(
                  text: 'Cancelled',
                ),
              ],
              onTap: (value) {},
            ),
            Expanded(
              child: TabBarView(controller: controller, children: [
                ElevatedButton(
                    onPressed: () {
                      Navigator.of(context).push(MaterialPageRoute(
                        builder: (context) => AnotherWidget(),
                      ));
                    },
                    child: Text("NA")),
                Text("CompletedClient"),
                Text("CancelledClient"),
              ]),
            )
          ],
        ),
      ),
    );
  }
}

对于测试用例

class AnotherWidget extends StatelessWidget {
  const AnotherWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        ElevatedButton(
          onPressed: () {
            Navigator.pushReplacement(
                context,
                MaterialPageRoute(
                    builder: (context) => OrderList(),
                    settings: RouteSettings(arguments: 2)));
          },
          child: Text("NV"),
        ),
      ],
    );
  }
}