Home > Back-end >  In Flutter, how can I return the value of my RadioButtonFormField class?
In Flutter, how can I return the value of my RadioButtonFormField class?

Time:09-01

I have created a class, RadioButtonFormField():

import 'package:flutter/material.dart';

class RadioButtonFormField extends StatefulWidget {
  final bool completed;
  const RadioButtonFormField({Key? key, required this.completed}) : super(key: key);

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

class _RadioButtonFormFieldState extends State<RadioButtonFormField> {

  int? _value;

  @override
  Widget build(BuildContext context) {

    if(widget.completed == true) {
      _value = 1;
    }

    if(widget.completed == false) {
      _value = 2;
    }

    return FormField( builder: (state) {

      return StatefulBuilder(
        builder: (BuildContext context, void Function(void Function()) setState) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              RadioListTile(
                title: const Text('Completed'),
                value: 1,
                groupValue: _value,
                onChanged: (value) {
                  setState(() {
                    _value = value as int;
                  });
                },
              ),
              RadioListTile(
                title: const Text('In Progress'),
                value: 2,
                groupValue: _value,
                onChanged: (value) {
                  setState(() {
                    _value = value as int;
                  });
                },
              ),
            ],
          );
        },
      );
      },
    );
  }
}

that I am using to set a boolean value to be used in my dialog on my homepage:

onTap: () => {

                                          startDate = campaigns[index].startDate,
                                          showDialog(
                                            context: context,
                                            builder: (BuildContext context) {
                                              return AlertDialog(
                                                content: Stack(
                                                  children: <Widget>[
                                                    Form(
                                                        key: _formKey,
                                                        child: Column(
                                                          mainAxisSize: MainAxisSize.min,
                                                          children: <Widget>[
                                                            Padding(
                                                              padding: const EdgeInsets.all(8.0),
                                                              child: TextFormField(
                                                                  validator: (value) {
                                                                    if(value == null || value.isEmpty) {
                                                                      return 'Please add a valid title.';
                                                                    }
                                                                    return null;
                                                                  },
                                                                  initialValue: campaigns[index].title,
                                                                  onSaved: (value) {
                                                                    title = value!;
                                                                  }
                                                              ),
                                                            ),
                                                            Padding(
                                                              padding: const EdgeInsets.all(8.0),
                                                                child: _buildStartDateField()
                                                            ),
                                                            Padding(
                                                                padding: const EdgeInsets.all(8.0),
                                                                child: RadioButtonFormField(completed: campaigns[index].completed)
                                                            ),
                                                            Padding(
                                                              padding: const EdgeInsets.all(8.0),
                                                              child: ElevatedButton(
                                                                child: const Text('Update Campaign'),
                                                                onPressed: () async{
                                                                  if(!_formKey.currentState!.validate()) {
                                                                    return;
                                                                  }


                                                                  _formKey.currentState!.save();
                                                                  updateCampaign(campaigns[index].id, title, startDate, completed!);

                                                                  Navigator.of(context).push(MaterialPageRoute(
                                                                      builder: (context) => const Nav()
                                                                  ));

                                                                  showDialog(
                                                                      context: context,
                                                                      builder: (ctx) => AlertDialog(
                                                                        title: const Text('Your campaign has been successfully updated!'),
                                                                        content: Text('$title has been updated and you have been returned to the home screen.'),
                                                                        actions: <Widget>[
                                                                          TextButton(
                                                                              onPressed: () {
                                                                                Navigator.of(ctx).pop(true);
                                                                              },
                                                                              child: const Text('Ok')
                                                                          )
                                                                        ],
                                                                      ));
                                                                },
                                                              ),
                                                            )
                                                          ],
                                                        )
                                                    ),
                                                  ],
                                                ),
                                              );
                                            },
                                          ),
                                        }

How can I return the value of my radiobutton to the original screen? Since it is an AlertDialog, I can't use Navigator.pop(), as that would return me to the original homescreen, outside of the alert Dialog.

CodePudding user response:

You can use a callback method on RadioButtonFormField.

class RadioButtonFormField extends StatefulWidget {
  final Function(int?) callback;

  final bool completed;
  const RadioButtonFormField(
      {Key? key, required this.callback, required this.completed})
      : super(key: key);

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

And on changed, do the same for others

RadioListTile<int>(
  title: const Text('Completed'),
  value: 1,
  groupValue: _value,
  onChanged: (value) {
    widget.callback(value);
    setState(() {
      _value = value as int;
    });
  },
),

And use like

RadioButtonFormField(
  completed: false,
  callback: (p0) {
    print(p0);
  },
),
  • Related