无法对单选按钮进行大量自定义。该按钮的唯一颜色参数是fillColor。它将影响内部普通圆和外部圆。
如果您真的想要自定义外观,您需要构建自己的小部件。 这是一个简单的示例,您可以自定义和改进。您还可以尝试从flutter Radio小部件的源代码开始。
class CustomRadio extends StatefulWidget {
final int value;
final int groupValue;
final void Function(int) onChanged;
const CustomRadio({Key? key, required this.value, required this.groupValue, required this.onChanged})
: super(key: key);
@override
_CustomRadioState createState() => _CustomRadioState();
}
class _CustomRadioState extends State<CustomRadio> {
@override
Widget build(BuildContext context) {
bool selected = (widget.value == widget.groupValue);
return InkWell(
onTap: () => widget.onChanged(widget.value),
child: Container(
margin: const EdgeInsets.all(4),
padding: const EdgeInsets.all(4),
decoration: BoxDecoration(shape: BoxShape.circle, color: selected ? Colors.white : Colors.grey[200]),
child: Icon(
Icons.circle,
size: 30,
color: selected ? Colors.deepPurple : Colors.grey[200],
),
),
);
}
}
结果 :
在Material Radio类中没有提供外圆的颜色,你可以创建自己的Radio按钮。有两种方法,一是从头开始创建(参考@Tanguy的答案),或者复制Radio类并更改其设计/行为。 如果选择复制Radio类,则需要继承Radio类,以便它可以与其他Material设计元素一起使用。 这里是一个Radio类的副本https://gist.github.com/karimkod/8f7c93da798670c8b6e9b85ff9fb5383 您可以更改_RadioPainter类的paint方法以绘制您想要的任何内容。我已经在gist中将其更改为紫色。