Flutter: Not able to select items in Radio button, in ListTile-CodePudding

Im a newbie, Not able to select items in Radio button, inside a ListTile. I tied to use same code without ListTile and working as expected. Looks like combination is not correct or i might be missing something.

class _TempState extends State<Temp> {
  int selectedValue = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: Container(
                child: Column(children: [
          Row(
            children: [
              Expanded(
                  child: Text("Radio button with ListView",))],),
          Expanded(
            child: ListView.builder(
                itemCount: 1,
                itemBuilder: (BuildContext context, int index) {
                  return OrderItem();
                }),),
        ]))));}

  Widget OrderItem() {
    int selectedValue = 0;
    return ListTile(
        title: Container(
            child: Column(children: [
      Row(
        children: [
          Expanded(
              child: Text(
            "Product Type :",
          )),
          Radio<int>(
            value: 1,
            groupValue: selectedValue,
            onChanged: (value) {
              setState(() {
                selectedValue = value != null ? value.toInt() : 1;
              });
            },
          ),
          Text('NRML'),
          Radio<int>(
              value: 2,
              groupValue: selectedValue,
              onChanged: (value) {
                setState(() {
                  selectedValue = value != null ? value.toInt() : 1;
                });
              }),
          Text('MARKET'),
        ],), ])));
  }}

CodePudding user response：

You are updating your selectedValue in wrong way ,first define your selectedValue like this:

int? selectedValue;

then update your widget like this:

Widget OrderItem() {//remove int selectedValue = 0; here
    return ListTile(
      title: Container(
        child: Column(
          children: [
            Row(
              children: [
                Expanded(
                    child: Text(
                  "Product Type :",
                )),
                Radio<int>(
                  value: 1,
                  groupValue: selectedValue,
                  onChanged: (value) {
                    setState(() {
                      selectedValue = value; //<-- change this
                    });
                  },
                ),
                Text('NRML'),
                Radio<int>(
                    value: 2,
                    groupValue: selectedValue,
                    onChanged: (value) {
                      setState(() {
                        selectedValue = value; //<-- change this
                      });
                    }),
                Text('MARKET'),
              ],
            ),
          ],
        ),
      ),
    );
  }

Also another reason that is not working is that you are define another int selectedValue = 0; in your OrderItem method, you need to remove it.

CodePudding user response：

In your second radio you should change your setState to

selectedValue = value != null ? value.toInt() : 2;

Value you assign to radio will be used to determine which radio is selected. So if you want to select second radio you should assign its value when selecting

CodePudding user response：

selectedValue = value != null ? value.toInt() : 2;

Value you assign to radio will be used to determine which radio is selected. So if you want to select second radio you should assign its value when selecting