【问题标题】:How to change the color of inactive/disabled title/subtitle in ListTile Flutter?如何更改 ListTile Flutter 中非活动/禁用标题/副标题的颜色?
【发布时间】:2021-09-23 08:08:52
【问题描述】:

我在更改 Flutter 中禁用/非活动 ListTile 的标题/副标题/前导颜色时遇到问题。

我的小部件如下所示:

ListTile 有一个尾随 Checkbox 并且它已被选中。标题/副标题的颜色为浅蓝色。我想改变这个颜色,但不知道如何。我试图用 ThemeData 改变它:

ThemeData(
    textTheme: TextTheme(
      subtitle1: TextStyle(
        color: Colors.grey[500],
      ),
    ),
  ),

但它仅适用于未选中的复选框,在选中后标题/副标题变为浅蓝色,但我希望它是灰色的 :( thic color 来自哪里?我还能尝试什么?我想我有这个问题由于我将 Flutter 升级到 3.24.0,在此之前一切都很好。我在 Flutter Web 上,不幸的是无法使用 DevTool Inspector。

【问题讨论】:

    标签: flutter dart colors


    【解决方案1】:

    如果您使用 Flutter 的 CheckboxListTile,请尝试使用 Flutter 中的行创建自定义 ListTile,例如:

    Row(crossAxisAlignment: CrossAxisAlignment.center, children: [
    
    Icon(Icons.account_box, color: Colors.white),
     Expanded(
     child: AutoSizeText(
      data,
      maxLines: 1,
      style: TextStyle(
        color: white,
      ),
      )
    ),
     Checkbox(
    value: _serachSelectList.contains(data),
    onChanged: (bool value) {
      setState(() {
        if (value) {
          _serachSelectList.add(data);
          setState((){ default_color = selected_color });
        } else {
          _serachSelectList.remove(data);
          setState((){ default_color = unselected_color });
        }
      });
    },
    checkColor: Colors.green,
    activeColor: Colors.transparent,
     materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
    ),
    
    ]);
    

    【讨论】:

    • 感谢您的回答!非常有创意,但我正在寻找更优雅的解决方案,并且我想使用已经存在的 Flutter 小部件。我只是想更改非活动标题/副标题的颜色,我知道它是在某个地方定义的,我只是想找到它并进行更改,所以构建一个新的小部件对我来说似乎不是最好的解决方案。
    • 您可以设置前导图标标题和副标题的颜色,并且checkBoxListTile中有activeColor属性也可以更新
    • 哦,我不知道 CheckBoxListTile 小部件存在,我会仔细看看,谢谢。但在我的情况下,我使用 List Tile 小部件,而 Checkbox 小部件是 ListTile 的尾随属性的子级。
    • 好的,实际上根据你的设计我认为你正在使用 CheckBoxListTile
    【解决方案2】:

    我刚刚找到了一个解决方案,但我认为可能还有另一个解决方案,可能是 ThemeData,所以我可以为每个 ListTile 小部件定义颜色,而无需使用其他小部件来更改它。

    可以像这样使用 ListTileTheme 更改非活动标题/副标题/前导的颜色:

    ListTileTheme(
      selectedColor: Colors.grey,
      child: ListTile(
        leading: Icon(Icons.featured_play_list_outlined),
        title: Text('Title'),
        subtitle: Text('Subtitle'),
                      ),
                  );
    

    所以基本上我必须用 ListTileTheme 包装 ListTile 并使用 selectedColor 属性,它就可以完成工作!非活动标题/副标题/前导的颜色发生变化。

    【讨论】:

      猜你喜欢
      • 2017-11-01
      • 1970-01-01
      • 2019-11-29
      • 2018-10-05
      • 2021-09-19
      • 2011-01-24
      • 1970-01-01
      • 1970-01-01
      • 2023-03-06
      相关资源
      最近更新 更多