TabBar + BottomBarNavigation场景中的控制器长度问题

时间:2019-06-15 09:29:06

标签: android ios flutter dart

我正在尝试构建一个使用TabBar和BottomBarNavigation的应用程序。

我试图通过几种方式来管理DefaultTabController的长度,但是只有当我从索引2转到索引1时,我才一直出错:

  

控制器的length属性(3)与颤动不匹配:TabBar的tabs属性中存在的选项卡元素数(2)。

我的代码:

import 'package:flutter/material.dart';

import './activites.dart';
import './evenements.dart';
import './offres_promos.dart';

class PrivesPage extends StatefulWidget {
  @override
  State createState() => PrivesPageState();
}

class PrivesPageState extends State<PrivesPage>
    with SingleTickerProviderStateMixin {
  int _index;
  int _length;

  @override
  void initState() {
    super.initState();
    _index = 0;
    _length = 3;
  }

  Widget _buildTabBar() {
    Widget _content;
    if (_index == 0) {
      _content = TabBar(tabs: <Tab>[
        Tab(text: "Tab 1 - index 0"),
        Tab(text: "Tab 2 - index 0"),
        Tab(text: "Tab 3 - index 0"),
      ]);
    } else if (_index == 1) {
      _content = TabBar(tabs: <Tab>[
        Tab(text: "Tab 1 - index 1"),
        Tab(text: "Tab 2 - index 1"),
      ]);
    } else if (_index == 2) {
      _content = null;
    }
    return _content;
  }

  Widget _buildTabBarView() {
    Widget _content;
    if (_index == 0) {
      _content = TabBarView(children: <Widget>[
        Page1(),
        Page2(),
        Page3(),
      ]);
    } else if (_index == 1) {
      _content = TabBarView(
        children: <Widget>[
          Page1(),
          Page2(),
        ],
      );
    } else if (_index == 2) {
      _content = TabBarView(
        children: <Widget>[
        ],
      );
    }
    return _content;
  }

  @override
  Widget build(BuildContext context) {
    print('Index ' + this._index.toString());
    print('length ' + this._length.toString());
    return DefaultTabController(
        length: _length,
        child: Scaffold(
          appBar: AppBar(
            title: Text("Home"),
            bottom: _buildTabBar(),
          ),
          body: _buildTabBarView(),
          bottomNavigationBar: BottomNavigationBar(
              currentIndex: _index,
              onTap: (int _index) {
                int l;
                if (_index == 0) {
                  l = 3;
                } else if (_index == 1) {
                  l = 2;
                } else if (_index == 2) {
                  l = 0;
                }
                setState(() {
                  this._length = l;
                  this._index = _index;
                });
              },
              items: <BottomNavigationBarItem>[
                BottomNavigationBarItem(
                  icon: Icon(Icons.my_location),
                  title: Text("Around me"),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.home),
                  title: Text("My city"),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.people),
                  title: Text("My account"),
                ),
              ]),
        ));
  }
}

我还尝试使用TabBarController在initState方法中设置长度来纠正此问题,但是它也不起作用。

TabController _controller;
  int _index;

  @override
  void initState() {
    super.initState();
    _controller = new TabController(length: _length, vsync: this);
    _index = 0;
  }

我认为我可能找不到正确的方法来完成此任务,但这是迄今为止开发此解决方案的唯一方法。

请帮助我更正我的代码或以其他方式构建它。

谢谢!

1 个答案:

答案 0 :(得分:0)

您正在更改标签栏的长度,但未更新控制器的标签栏的长度。通过将其添加到您的setState中进行相应的更新。

  setState(() {
                  this._length = l;
                  this._controller = new TabController(length: _length, vsync: this);
                  this._index = _index;
                });