Radio buttons not reacting to press

Question

I feel as if this is something to do with the fact that I have them inside a modal, regardless, I cant seem to figure this out. Both the Radio buttons and the list tiles are visible in the modal but they have no reaction when pressed. I have tried placing the difficulty variable under both the of builders, (one for the whole page and the one for the modal itself but had no luck), along with before the returns but no luck, I'm pretty positive it's something wrong with the variable location but nothing is working.

Here's the code:

import 'package:flutter/material.dart';
import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  //String? difficulty
  @override
  Widget build(BuildContext context) {
    //String? difficulty
    return Scaffold(
        body: Builder(
            builder: (context) => Center(
                  //on press of this button have modal come from bottom with create screen
                  child: TextButton(
                      onPressed: () {
                        showModalBottomSheet(
                          context: context,
                          builder: (context) {
                            String? difficulty;

                            return Padding(
                              padding: const EdgeInsets.only(
                                  left: 20, right: 20, top: 20),
                              child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    const Text(
                                      "Difficulty",
                                      style: TextStyle(fontSize: 20),
                                    ),
                                    //this is where the radio buttons will sit

                                    ListTile(
                                      title: const Text("easy"),
                                      leading: Radio(
                                          value: 'easy',
                                          groupValue: difficulty,
                                          onChanged: (value) {
                                            setState(() {
                                              difficulty = value;
                                            });
                                          }),
                                    ),
                                    ListTile(
                                      title: const Text("medium"),
                                      leading: Radio(
                                          value: 'medium',
                                          groupValue: difficulty,
                                          onChanged: (value) {
                                            setState(() {
                                              difficulty = value;
                                            });
                                          }),
                                    )
                                  ]),
                            );
                          },
                        );
                      },
                      child: const Text("Create Bubble")),
                )));
  }
}

All help is appreciated!

move String? difficulty; outside build method or Builder widget — Rubens Melo, Jul 03 '22 at 00:57
@RubensMelo Thanks for the response, no luck with that though. I updated the code with comments on the locations I have had no luck with — Marko, Jul 03 '22 at 01:05
Without providing the code for the modal sheet it's hard to tell, however, try setting `difficulty` as a global variable, see: https://stackoverflow.com/questions/29182581/global-variables-in-dart — MendelG, Jul 03 '22 at 02:05

Nabinda · Accepted Answer · 2022-07-03T04:39:40.250

The problem was bottom sheet state was not being update

class Home extends StatelessWidget {
Home({Key? key}) : super(key: key);
String? difficulty;
@override
Widget build(BuildContext context) {
return Scaffold(
    body: Center(
  //on press of this button have modal come from bottom with create screen
  child: TextButton(
      onPressed: () {
        showModalBottomSheet(
          context: context,
          builder: (context) {
            //Stateful class was not updating the bottomsheet state 
            //I created statefulbuilder where required
            return StatefulBuilder(
                builder: (context, StateSetter setModalState) {
              return Padding(
                padding:
                    const EdgeInsets.only(left: 20, right: 20, top: 20),
                child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      const Text(
                        "Difficulty",
                        style: TextStyle(fontSize: 20),
                      ),
                      //this is where the radio buttons will sit

                      ListTile(
                        title: const Text("easy"),
                        leading: Radio(
                            value: 'easy',
                            groupValue: difficulty,
                            onChanged: (value) {
                            // set is changed here 
                              setModalState(() {
                                difficulty = value.toString();
                              });
                            }),
                      ),
                      ListTile(
                        title: const Text("medium"),
                        leading: Radio(
                            value: 'medium',
                            groupValue: difficulty,
                            onChanged: (value) {
                               // set is changed here 
                              setModalState(() {
                                difficulty = value.toString();
                              });
                            }),
                      )
                    ]),
              );
            });
          },
        );
      },
      child: const Text("Create Bubble")),
));
}
}

Hello, can you please [edit] your answer to provide some more explanation as to what the problem was? you will also possibly get more up-votes by doing so — MendelG, Jul 03 '22 at 02:13

Radio buttons not reacting to press

1 Answers1