How to set a radio button checked by default in Flutter?

38,552

Solution 1

add an initial state

class _ProductTypeScreen extends State<ProductType> {

  String _radioValue; //Initial definition of radio button value
  String choice;

  // ------ [add the next block] ------ 
  @override
  void initState() {
    setState(() {
      _radioValue = "one";
    });
    super.initState();
  }
  // ------ end: [add the next block] ------  

  void radioButtonChanges(String value) {
    setState(() {
      _radioValue = value;
      switch (value) {
        case 'one':
          choice = value;
          break;
        case 'two':
          choice = value;
          break;
        case 'three':
          choice = value;
          break;
        default:
          choice = null;
      }
      debugPrint(choice); //Debug the choice in console
    });
  }

  @override
  Widget build(BuildContext context) {

Solution 2

I will give a simple example to understand :

int _radioSelected = 1;**
String _radioVal;

     child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text('Male'),
                  Radio(
                    value: 1,
                    groupValue: _radioSelected,
                    activeColor: Colors.blue,
                    onChanged: (value) {
                      setState(() {
                        _radioSelected = value;
                        _radioVal = 'male';
                      });
                    },
                  ),
                  Text('Female'),
                  Radio(
                    value: 2,
                    groupValue: _radioSelected,
                    activeColor: Colors.pink,
                    onChanged: (value) {
                      setState(() {
                        _radioSelected = value;
                        _radioVal = 'female';
                      });
                    },
                  )
                ],
              ),
Share:
38,552
Fellipe Sanches
Author by

Fellipe Sanches

I'm a developer that &lt;3 Matrix, Godzilla, Back to the Future and of course, code.

Updated on July 09, 2022

Comments

  • Fellipe Sanches
    Fellipe Sanches almost 2 years

    By default Flutter shows all the radio buttons empty (unchecked).

    How to set a radio button checked by default?

    I'm posting this question to document my solution, that may help some one, and also start a topic about this, because I didn't find anything about it here.

    Below the radio button code:

    class _ProductTypeScreen extends State<ProductType> {
    
      String _radioValue; //Initial definition of radio button value
      String choice;
    
      void radioButtonChanges(String value) {
        setState(() {
          _radioValue = value;
          switch (value) {
            case 'one':
              choice = value;
              break;
            case 'two':
              choice = value;
              break;
            case 'three':
              choice = value;
              break;
            default:
              choice = null;
          }
          debugPrint(choice); //Debug the choice in console
        });
      }
    
      // Now in the BuildContext... body widget:
    
      @override
      Widget build(BuildContext context) {
      //First of the three radio buttons
    
      Row(
        children: <Widget>[
          Radio(
            value: 'one',
            groupValue: _radioValue,
            onChanged: radioButtonChanges,
          ),
          Text(
            "One selected",
          ),
        ],
      ),
    
  • questionasker
    questionasker almost 5 years
    Hi, How about if we need to retrieve _radioValue from storage? i tried it, but not working, because load SharedPreferences need to use await
  • Juanes30
    Juanes30 almost 5 years
    with the preference, you can use a Future method and execute it from initState
  • questionasker
    questionasker almost 5 years
    I try it, but not pointing to saved value, please see stackoverflow.com/questions/57040874/…
  • Fathima Shafana
    Fathima Shafana over 2 years
    how to set a radio button in flutter based on value from database?