I know that I can wrap my radio widgets with theme widget but in my case, i use different ways. how to make my radio button have a grey background color when on unselected?

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        RadioListTile<SingingCharacter>(
          title: const Text('Akaun Individu', style: TextStyle(fontWeight: FontWeight.bold),),
          subtitle: Text('Membuat pembayaran untuk diri sendiri'),
          controlAffinity: ListTileControlAffinity.trailing,
          value: SingingCharacter.akaunSendiri,
          groupValue: _character,
          onChanged: (SingingCharacter? value) {
            setState(() {
              _character = value;
            });
          },
        ),
        Divider(thickness: 2),
        RadioListTile<SingingCharacter>(
          title: const Text('Akaun Syarikat', style: TextStyle(fontWeight: FontWeight.bold),),
          subtitle: Text('Membuat pembayaran untuk organisasi'),
          controlAffinity: ListTileControlAffinity.trailing,
          value: SingingCharacter.akaunSyarikat,
          groupValue: _character,
          onChanged: (SingingCharacter? value) {
            setState(() {
              _character = value;
            });
          },
        ),
      ],
    );
  }
}

CodePudding user response：

You can do this with overriding theme data.

Example:

...
 body: Center(
        child: Theme(
          data: Theme.of(context).copyWith(
            unselectedWidgetColor: Colors.purple,
          ),
          child: Column(
            children: [
              RadioListTile<String>(
                title: const Text(
                  'RadioListTile 1',
                  style: TextStyle(fontWeight: FontWeight.bold),
                ),
                subtitle: const Text('Selected'),
                controlAffinity: ListTileControlAffinity.trailing,
                value: 'value',
                groupValue: 'value',
                onChanged: (String? value) {},
              ),
              RadioListTile<String>(
                title: const Text(
                  'RadioListTile 2',
                  style: TextStyle(fontWeight: FontWeight.bold),
                ),
                subtitle: const Text('Unselected'),
                controlAffinity: ListTileControlAffinity.trailing,
                value: 'value',
                groupValue: 'valuex',
                onChanged: (String? value) {},
              ),
            ],
          ),
        ),
      ),
...

CodePudding user response：

add this property to your tile tileColor: varUnselect ? Colors.grey : Colors.transparent, varUnselect is get value of unselect radio