扩展时尾随改变他的颜色答案

【问题标题】：Trailing change his color when expanded扩展时尾随改变他的颜色
【发布时间】：2020-02-12 15:56:27
【问题描述】：

我有这种情况，我使用下面的代码创建了一个 ExpansionTile，它工作正常，但是当展开时，尾随改变颜色，黑色到白色，它发生在标题和副标题上，但我手动定义了样式解决它，但我怎样才能做到这一点？

ExpansionTile(
   leading: Icon(
     Icons.library_music,
     size: 40.0,
     color: SECONDARYCOLOR,
   ),
   title: Text(
      'Pop Rock',
      style: TextStyle(
         fontSize: 12,
         color: Colors.black,
      ),
   ),
   subtitle: Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
         Text(
            'Músicas: 30',
            style: TextStyle(
              fontSize: 12,
              color: Colors.black,
            ),
         ),
         Text(
            'Duração: 2:20',
            style: TextStyle(
               fontSize: 12,
               color: Colors.black,
            ),
         ),
      ],
   ),
   children: <Widget>[
      Column(
         children: <Widget>[
            Text('_buildExpandableContent(policies[i])'),
         ],
      ),
   ],
),```

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

你的问题看起来像这样：Custom style or theme for Expansion Tile Header, Flutter

我已经在 DartPad 中测试了一些代码，您可以使用类似的方法定义前导图标和尾随图标的颜色：

Theme(
  data: Theme.of(context).copyWith(unselectedWidgetColor: SECONDARYCOLOR),
  child: ExpansionTile(
    leading: Icon(Icons.library_music, size: 40.0),
    title: Text(
      'Pop Rock',
      style: TextStyle(
        fontSize: 12,
        color: Colors.black,
      ),
    ),
    subtitle: Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        Text(
          'Músicas: 30',
          style: TextStyle(
            fontSize: 12,
            color: Colors.black,
          ),
        ),
        Text(
          'Duração: 2:20',
          style: TextStyle(
            fontSize: 12,
            color: Colors.black,
          ),
        ),
      ],
    ),
    children: <Widget>[
      Column(
        children: <Widget>[
          Text('_buildExpandableContent(policies[i])'),
        ],
      ),
    ],
  ),
)

【讨论】：

【解决方案2】：

在我的情况下，要支持两种状态 - 折叠和展开 - 对于图标颜色，必须使用以下组合：

在 ExpansionTile 中设置属性：iconColor

    Widget expansionTile = ExpansionTile(

        iconColor: Colors.white,

        title: Text('Visible'),
        children: [
           Text('Expanded element')
        ]
    );

然后将其包装在一个主题中，并设置：unselectedWidgetColor

    expansionTile = Theme(
        data: Theme.of(_ctxt).copyWith(
          unselectedWidgetColor: Colors.white,
        ),
        child: expansionTile);

【讨论】：

【解决方案3】：

您可以使用ExpandedTile 的以下属性轻松设置标题、副标题和图标（前导和尾随）的颜色，无论它们是折叠还是展开时：

textColor: 展开时标题和副标题的颜色
collapsedTextColor: 折叠时标题和副标题的颜色
iconColor: 展开时前导和尾随图标的颜色
collapsedIconColor: 折叠时前导和尾随图标的颜色

【讨论】：