How to get a value from a dialog in flutter?

Question

I am creating an app and I want to show a dialog for the user which contains a slider to pick a value.

the problem comes here, I want to get the value of that slider which user picked and deal with it.

I am using the dialog as a stateful widget and everything works okay except returning the value as I've mentioned.

---

The Widget

class Dialog extends StatefulWidget {
  @override
  _DialogState createState() => _DialogState();

  final double val;

  Dialog({this.val,});
}

class _DialogState extends State<Dialog> {
  double value = 0;

  @override
  void initState() {
    super.initState();
    value = widget.val;
  }
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Slider(
        value: value,
        min: 0,
        max: 100,
        onChanged: (va) {
          setState(() {
            value = va;
          });
        },
      ),
    );
  }
}

show dialog code

double vale = 0;

-------

() async {
            await showDialog(
              context: context,
              builder: (context) => Dialog(
                val: vale,
              ),
            );
          }

Answer 1

What is missing is that you need to return the value when closing the dialog, like this:

return AlertDialog(
  title: Slider(
    value: value,
    min: 0,
    max: 100,
    onChanged: (va) {
      setState(() {
        value = va;
      });
    },
  ),
  actions: [
    ElevatedButton(
        onPressed: () => Navigator.pop(context),
        child: Text('cancel')),
    ElevatedButton(
        onPressed: () => Navigator.pop(context, value),
        child: Text('confirm')),
  ],
);

It will then be returned by the showDialog function as expected as a Future

Answer 2

You can access and use the value that comes from your dialog option like this:

showDialog(
  context: context,
  builder: (context) => Dialog(
    val: vale,
  ),
).then((valueFromDialog){
  // use the value as you wish
  print(valueFromDialog);
});

The .then()will be triggered after the user selects an option on your Dialog.