Radio Button Unselected Color in Flutter
Set unselectedWidgetColor
prop of theme in MaterialApp
like below:
return new MaterialApp(
title: 'xyz',
home: xyz(),
theme: ThemeData(
brightness: Brightness.dark,
unselectedWidgetColor:Colors.white
),
);
A useful tip that read the source code of radio.dart and you will get everything!
Sure, you have to change the ThemeData
of the container of your Radio buttons.
Assuming that you are using a Row
Container:
Theme(
data: ThemeData.dark(), //set the dark theme or write your own theme
child: Row(
children: <Widget>[
Radio(
//your attributes here...
),
Radio(
//your attributes here...
)
],
),
)
How it works?
Because if you check the code of the ThemeData
, you'll see this validation
unselectedWidgetColor ??= isDark ? Colors.white70 : Colors.black54;
then dark theme is using white70
In case you want only to change Border Color for Widget when it's unselected
Just Customize Fill Color property
Radio(
//here -----
fillColor:
MaterialStateProperty.resolveWith<Color>(
(Set<MaterialState> states) {
return (isSelected)
? CustomColors.green
: CustomColors.greyMedium;
}),
// ----
value: 'en',
groupValue: langValue,
activeColor: Theme.of(context).primaryColor,
onChanged: (value) {},
),
Wrap your Radio Widgets with Theme widget and add theme data with unselectedWidgetColor as color you want
Ex:
Theme(
data: ThemeData(
//here change to your color
unselectedWidgetColor: Colors.White,
),
child: Row(
children: <Widget>[
Radio(),
Radio()
],
),
);