繁体   English   中英

如何在 Flutter 中更改收音机的非活动颜色?

[英]How to change radio's inactive color in Flutter?

我在ListTile有一个Radio按钮。 单击ListTile ,我更改Radio的值。 我不希望收音机可点击,所以我不提供onChanged回调:

ListTile(
  onTap: () => onChanged(template.id),
  leading: Radio(
    value: template.id,
    groupValue: checkedId,
  )
  ...
)

这样做后, Radio将变为“不活动”并将其颜色更改为灰色。 Radio有一个activeColor属性,但不是用于非活动的。

如果我为RadioonChanged属性提供了一个虚拟函数 - 它会变为活动状态,但问题是我不希望它可点击,我希望ListTile仅可点击(原因是 - 我希望能够取消选中Radio

此外,我只想更改那些特定Radio按钮的非活动颜色,而不是整个应用程序。

当前结果:

演示 1

onChange结果(单击它时我无法取消选中收音机):

演示 2

Radio使用unselectedWidgetColorThemeData 如果您只需要为特定屏幕上的几个收音机更改它,请将它们包装在Theme小部件中以覆盖颜色:

Theme(
  data: Theme.of(context).copyWith(
    unselectedWidgetColor: Colors.red,
    disabledColor: Colors.blue
  ),
  child: Column(
    children: <Widget>[
      ListTile(
        onTap: () => setState(() => value = 0),
        leading: Radio(
          value: 0,
          groupValue: value,
          onChanged: (v) => setState(() => value = v),
        )
      ),
      ListTile(
        onTap: () => setState(() => value = 1),
        leading: Radio(
          value: 1,
          groupValue: value,
          onChanged: (v) => setState(() => value = v),
        )
      ),
    ],
  ),
)

如果没有回调传入onChangedRadio ,则将其解释为禁用(这适用于许多默认材质小部件)。

您还可以设置fillColor属性,它为多个无线电状态解析颜色。 在这种情况下,它为所有状态返回Colors.blue

Radio(
          fillColor: MaterialStateColor.resolveWith((states) => Colors.blue),
          value: 1,
          groupValue: _optionValue,
          onChanged: changeValue,
        )

要更改收音机未选择的颜色:

unselectedWidgetColor: Colors.green,

要更改收音机选定的颜色:

toggleableActiveColor: Colors.green,

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM