Флаттер: Как изменить цвет значка вкладки на слайде, а не только на кране? - PullRequest
Новая
       31

Флаттер: Как изменить цвет значка вкладки на слайде, а не только на кране?

0 голосов
/ 24 января 2020

Итак, я настроил TabBarView с его вкладками, содержащими значок и текст каждой. Текст, кажется, линейно меняет цвет при переключении между вкладками с помощью скольжения. Как добиться такого же эффекта и для иконки? Мне удалось заставить его переключать цвет на TAP, но он не подчиняется тому же правилу при скольжении.

Я пробовал с tabController.index == 0 et c. Все еще не работает.

Ответы [ 2 ]

1 голос
/ 24 января 2020

Пожалуйста, попробуйте следующий код:

  • labelColor: Colors.black, // Выбранный цвет вкладки (иконка, текст)
  • unselectedLabelColor: Colors.amber , // Не выбран цвет вкладки (значок, текст)

============================= ================================================ 

import 'package:flutter/material.dart';

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

class TabBarDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              unselectedLabelColor: Colors.amber, // UnSelected Tab Color
              labelColor: Colors.black, // Selected Tab Color
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.directions_transit)),
                Tab(icon: Icon(Icons.directions_bike)),
              ],
            ),
            title: Text('Tabs Demo'),
          ),
          body: TabBarView(
            children: [
              Icon(Icons.directions_car),
              Icon(Icons.directions_transit),
              Icon(Icons.directions_bike),
            ],
          ),
        ),
      ),
    );
  }
}
0 голосов
/ 24 января 2020

Работа с Tap Или Sliding Оба: 

child: new TabBar(
                  indicatorColor: Colors.white,
                  unselectedLabelColor: Colors.grey, // for unselected
                  labelColor: Colors.white, // for selected
                  indicatorWeight: 5.0,
                  tabs: [
                    new Tab(
                      text: 'Unpaid'.toUpperCase(),
                    ),
                    new Tab(
                      text: 'Draft'.toUpperCase(),
                    ),
                    new Tab(
                      text: 'All'.toUpperCase(),
                    ),
                  ],
                ),
              ),
            ),
            body: new TabBarView(
              children: [
                new first.UnpaidInvoicePage(),
                new second.PaidInvoicePage(),
                new third.AllInvoicePage(),
              ],
            ),
...