如何在Flutter中获取当前选项卡索引

发布时间：2020-12-14 14:52:13 所属栏目：百科来源：网络整理

导读：在颤动中,实现标签布局既简单又直接.这是官方 documentation的一个简单示例： import 'package:flutter/material.dart';void main() { runApp(new TabBarDemo());}class TabBarDemo extends StatelessWidget { @override Widget build(BuildContext context)

在颤动中,实现标签布局既简单又直接.这是官方 documentation的一个简单示例：

import 'package:flutter/material.dart';

void main() {
  runApp(new TabBarDemo());
}

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

但事情就是这样,我想获得活动的tab索引,以便我可以在某些选项卡上应用一些逻辑.我搜索文档,但我无法弄清楚.你们能帮帮忙吗？

解决方法

DefaultTabController的重点是让它自己管理标签.

如果您想要一些自定义选项卡管理,请改用TabController.
使用TabController,您可以访问更多信息,包括当前索引.

class MyTabbedPage extends StatefulWidget {
  const MyTabbedPage({Key key}) : super(key: key);
  @override
  _MyTabbedPageState createState() => new _MyTabbedPageState();
}

class _MyTabbedPageState extends State<MyTabbedPage>
    with SingleTickerProviderStateMixin {
  final List<Tab> myTabs = <Tab>[
    new Tab(text: 'LEFT'),new Tab(text: 'RIGHT'),];

  TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = new TabController(vsync: this,length: myTabs.length);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        bottom: new TabBar(
          controller: _tabController,tabs: myTabs,body: new TabBarView(
        controller: _tabController,children: myTabs.map((Tab tab) {
          return new Center(child: new Text(tab.text));
        }).toList(),);
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!