flutter - 滑动时如何更改 TabBar 指示器颜色（Flutter）

Question

滑动时是否可以通过编程方式更改 TabBar 指示器？

我尝试使用构建器来获取索引，但我没有任何运气.. 我确信一定有办法做到这一点，但还没有弄清楚

Color _indicatorColor(index) {
    switch (index) {
      case 0:
        return Colors.purple;
        break;
      case 1:
        return colorInfoLighter;
        break;
      case 2:
        return Colors.pink;
        break;
    }
  }

  Widget _buildScreen() {
    var index;
    return Scaffold(
      appBar: AppBar(),
      bottomNavigationBar: TabBar(
          onTap: (_) {
            setState(() {});
          },
          indicatorWeight: 4,
          indicatorColor: _indicatorColor(index),
          tabs: [
            _requestedLabel(),
            _completedLabel(),
            _cancelledLabel(),
          ]),
      body: Container(
        child: TabBarView(children: [
          _requestedTab(),
          _completedTab(),
          _cancelledTab(),
        ]),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: _buildScreen(),
    );
  }

标签： flutterdart

Answer 1

你的意思是改变标签？

import 'dart:math';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({
    Key key,
  }) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  final colors = [Colors.purple, Colors.green, Colors.pink];
  Color indicatorColor;
  TabController _controller;

  @override
  void initState() {
    super.initState();
    _controller = TabController(length: 3, vsync: this)
      ..addListener(() {
        setState(() {
          indicatorColor = colors[_controller.index];
        });
      });
    indicatorColor = colors[0];
  }

  Widget _buildScreen() {
    return Scaffold(
      appBar: AppBar(),
      bottomNavigationBar: Container(
        color: Colors.blue,
        child: TabBar(
            labelColor: Colors.black,
            controller: _controller,
            indicatorWeight: 4,
            indicatorColor: indicatorColor,
            tabs: [
              Tab(
                child: Container(
                  child: Text('A'),
                ),
              ),
              Tab(
                child: Text('B'),
              ),
              Tab(
                child: Text('C'),
              ),
            ]),
      ),
      body: Container(
        child: TabBarView(
          controller: _controller,
          children: [
            Center(
              child: Text('aa'),
            ),
            Center(
              child: Text('bb'),
            ),
            Center(
              child: Text('cc'),
            ),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: _buildScreen(),
    );
  }
}