如何使标签栏的活动状态和非活动状态具有不同的图标,并保持指示器动画

时间:2019-11-13 06:29:14

标签: flutter

我有五个如下所示的标签

Tab(
    icon: SvgPicture.asset(
      _getSvgName(
        tabIndex: 0,
      ),
    ),
    child: Text(
      '홈',
      style: TextStyle(
        fontSize: 12.0,
      ),
    ),
  ),

下面确定svg图标名称的代码

String _getSvgName({
    @required int tabIndex,
  }) {
    String root;

    if (tabIndex == 0) {
      root = 'assets/svgs/tab-home';
    } else if (tabIndex == 1) {
      root = 'assets/svgs/tab-posts';
    } else if (tabIndex == 2) {
      root = 'assets/svgs/tab-news';
    } else if (tabIndex == 3) {
      root = 'assets/svgs/tab-alarm';
    } else if (tabIndex == 4) {
      root = 'assets/svgs/tab-profile';
    } else {
      throw Exception('index out of bounds');
    }

    if (tabIndex == _tabController.index) {
//      root = root + '.svg';

      root = root + '-active.svg';
    } else {
      root = root + '.svg';
    }

    return root;
  }

我还在听tabController的更改,以便可以更新tabbar的当前索引。问题在于,一旦我运行setState()来反映选项卡索引的变化,指示器的滑动动画就会被杀死-它会立即移至下一个选项卡,而不是像默认行为那样平稳地滑过。我该如何克服这个问题?

0 个答案:

没有答案