flutter radio button list tiles not changing

Viewed 30

What I'm trying to do is to build a list of radio buttons tiles that its titles come from API response, and of types string and it worked, the problem is that when I change the selection of the buttons nothing happens and the UI still with the initial selection, the value of the selection itself don't change.

_getTypes() => StatefulBuilder(
builder: (BuildContext context, StateSetter radioButtonsState) {
  _type = _types.isNotEmpty? _types[0] : '';
    List<Widget> typeWidgets = [];
    _types.forEach((element) {
      var type = RadioListTile<String>(
        title: Text(element),
        value: _type,
        groupValue: element,
        onChanged: (value){
          _type = value.toString();
          print('user type: $_type');
          radioButtonsState(() {
            _type = value.toString();
            print('user type: $_type');
          });
        },
      );
      typeWidgets.add(type);
      if(element == 'CompanyAdmin'){
        var speciality = AnimatedSwitcher(
          duration: const Duration(milliseconds: 200),
          child: _type == 'CompanyAdmin'
              ? _specialitiesDropDownList(): const SizedBox(),
          transitionBuilder: (child, animation) {
            return SlideTransition(
              position: Tween<Offset>(
                begin: const Offset(0.0, 0.2),
                end: Offset.zero,
              ).animate(animation),
              child: child,
            );
          },
        );
        typeWidgets.add(speciality);
      }
      if(element == 'Employee'){
        var speciality = AnimatedSwitcher(
          duration: const Duration(milliseconds: 200),
          child: _type == 'Employee'
              ? _specialitiesDropDownList(): const SizedBox(),
          transitionBuilder: (child, animation) {
            return SlideTransition(
              position: Tween<Offset>(
                begin: const Offset(0.0, 0.2),
                end: Offset.zero,
              ).animate(animation),
              child: child,
            );
          },
        );
        typeWidgets.add(speciality);
      }
    });
    return Column(
      children: typeWidgets,
    );
},

);

1 Answers

The fix is simple, the value and groupValue are inverted between each other. Change it to:

value: element,
groupValue: _type,

The currently selected item is passed into groupValue, and if groupValue and value match, the radio will be selected.

Related