Изменение цвета конечного значка в ExpansionTile

Мне нужно изменить цвет следа keyboard_down_arrow в ExpansionTile. Я попытался обернуть его в виджет темы и установить акцент, основной и IconTheme, но, похоже, ничего не работает.

Theme(
                  data: Theme.of(context).copyWith(
                    dividerColor: Colors.transparent,
                    accentColor: Colors.black,
                  ),
                  child: ExpansionTile(
                    //
                    title: Text("Some Text"
                    ),
                    childrenPadding: EdgeInsets.symmetric(horizontal: 15),
                    children: [
                      
                    ],
                  ),
                ),

5 ответов

Решение

Я нашел решение указанной выше проблемы.

набор unselectedWidgetColor свойство к цвету, который вы хотите в классе Theme в flutter.

У меня есть последнее решение как с открытым, так и с закрытым состоянием:

      Theme(
    data: Theme.of(context).copyWith(
      unselectedWidgetColor: Colors.white, // here for close state
      colorScheme: ColorScheme.light(
          primary: Colors.white,
      ), // here for open state in replacement of deprecated accentColor
      dividerColor: Colors.transparent, // if you want to remove the border
    ),
    child: ExpansionTile(
        ...
    ),
),...

Чтобы изменить цвет конечного значка, вы можете использовать следующий параметр в Expansion Tile.

 trailing: Icon(
              Icons.keyboard_arrow_down,
              color: Colors.green,
            ),

Пример:

 ExpansionTile(
                //
                title: Text("Some Text"),
                trailing: Icon(
                  Icons.keyboard_arrow_down,
                  color: Colors.green,
                ),
              ),

И для использования цвета темы color: Theme.of(context).primaryColor,

ExpansionTileимеет свойства:

      iconColor: Colors.black,
collapsedIconColor: Colors.orange,

Он меняет цвет завершающего значка в зависимости от того, развернута плитка или нет.

Если вам нужно более динамичное/общее решение;

          ExpansionTileThemeData expansionTileTheme(ColorScheme colors) {
    return ExpansionTileThemeData(iconColor: Colors.white);
  }

используйте эти данные темы в файле theme.dart, который вы используете для светлой и темной темы, вот так

         ThemeData light([Color? targetColor]) {
    final colorScheme = colors(Brightness.light, targetColor);
    return ThemeData.light().copyWith(
      // unselectedWidgetColor: colorScheme.onPrimary,
      expansionTileTheme: expansionTileTheme(colorScheme),);
  }

в main.dart

       MaterialApp.router(            
  theme: theme.light(Color),
  );

Это повлияет на весь ваш проект, поэтому вам не нужно будет использовать этот цвет в каждой плитке расширения, которую вы будете использовать.

Другие вопросы по тегам