Search code examples
listflutterdartradiobuttonlist

Quicker way to implement into a list?


Im making a list of radio buttons. But cant figure a way to map them. The current method making one by one which is too much and with 10+ radio buttons this is taking up hundreds of lines of code.

enum SingingCharacter {char1, char2, char3, char4}
class _HomeScreenState extends State<HomeScreen> {
  SingingCharacter _character = SingingCharacter.char1;

  final List myList= ['One','Two','Thre' ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Home'),
        ),
        body: Container(
          child: Column(children: <Widget>[
            RadioListTile<SingingCharacter>(
              title: Text('${myList[0]}'),
              value: SingingCharacter.char1,
              groupValue: _character,
              onChanged: (SingingCharacter value) {
                setState(() {
                  _character = value;
                });
              },
            ),
            RadioListTile<SingingCharacter>(
              title: Text('${myList[1]}'),
              value: SingingCharacter.char2,
              groupValue: _character,
              onChanged: (SingingCharacter value) {
                setState(() {
                  _character = value;
                });
              },
            )
            ....
          ]),
        ));
  }
}

Any method to loop through this and show in children? Thanks


Solution

  • You could change your List to a Map and then use this to map your enum values to Widgets. Like this (disclaimer: Code not tested, but something like this should be possible):

    enum SingingCharacter {char1, char2, char3}
    
    class _HomeScreenState extends State<HomeScreen> {
      SingingCharacter _character = SingingCharacter.char1;
    
      final Map<SingingCharacter, String> radioMap = {SingingCharacter.char1: 'One', SingingCharacter.char2: 'Two', SingingCharacter.char3: 'Three'};
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Home'),
          ),
          body: Container(
            child: Column(
              children: _generateRadioButtons()
            ),
          )
        );
      }
    
      List<Widget> _generateRadioButtons() {
        return SingingCharacter.values.map((char) {
          return RadioListTile<SingingCharacter>(
            title: Text('${radioMap[char]}'),
            value: char
            groupValue: _character,
            onChanged: (SingingCharacter value) {
              setState(() {
                _character = value;
              });
            },
          );
        }).toList();
      }
    }