Change the value of the radio button when selected

Question

Ive got a list of strings

List<String> answerOptions=['Apple','Orange','Grapes','Kiwi'];

and I've created a custom radio button file named QuizRadioButton

class QuizRadioButton extends StatefulWidget {
  final String label;
  final void Function(dynamic) onChanged;

 const QuizRadioButton(
     {required this.label, required this.onChanged, Key? key})
      : super(key: key);

    @override
     _QuizRadioButtonState createState() => _QuizRadioButtonState();
    }

    class _QuizRadioButtonState extends State<QuizRadioButton> {
     int? _value = 0;

      @override
       Widget build(BuildContext context) {
        return Padding(
        padding: const EdgeInsets.all(16.0),
        child: Row(
         children: [
           Radio<int>(
            value: 1,
            groupValue: _value,
            onChanged: (value) => setState(() => _value = value),
            ),
            Text(widget.label, style: Theme.of(context).textTheme.headline3),
    ],
  ),
);
}
}

I've used this radio button class and I've populated 4 radio buttons using the list mentioned above

Widget content(BuildContext context){
return Padding(
  padding: const EdgeInsets.all(16.0),
  child: Column(
    children: <Widget>[
      Text('which fruit of these are red in color ?'),
      SizedBox(height: 30.0,),
      for(int i=0;i<answerOptions.length;i++)Container(
        child:QuizRadioButton(label: answerOptions[i], onChanged: (value){}) ,
      )


    ],
  ),
);
}

and I get the output as

Right now we can select all 4 radio buttons at once, what I want is if I want to pick apple, the radio button with apple as the label should be true and others as false. Please help

Answer 1

int groupVal=0;

Implementation:

Widget content(BuildContext context){
  return Padding(
    padding: const EdgeInsets.all(16.0),
    child: Column(
      children: <Widget>[
        Text('which fruit of these are red in color ?'),
        SizedBox(height: 30.0,),
        for(int i=0;i<answerOptions.length;i++)
          Container(
            child:QuizRadioButton(label: answerOptions[i], onChanged: (value){
              setState(() {
                groupVal=value;
              });
            }, index: i, groupVal: groupVal) ,
          )

      ],
    ),
  ),
}

Your QuizRadioButton:

class QuizRadioButton extends StatefulWidget {
  final String label;
  final void Function(dynamic) onChanged;
  int index,groupVal;

  QuizRadioButton(
      {required this.label, required this.groupVal, required this.onChanged, required this.index, Key? key})
      : super(key: key);

  @override
  _QuizRadioButtonState createState() => _QuizRadioButtonState();
}

class _QuizRadioButtonState extends State<QuizRadioButton> {

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Row(
        children: [
          Radio<int>(
            value: widget.index,
            groupValue: widget.groupVal,
            onChanged: widget.onChanged,
          ),
          Text(widget.label, style: Theme.of(context).textTheme.headline3),
        ],
      ),
    );
  }
}