Flutter - Why setstate doesn't work on popup?

Question

I want to change the text on popup with user interaction but it is not changing. I've tried navigator.pop(context) and relaunch show method. It correctly work but is it a correct way? And can I change value on the popup without Navigator.pop. Why doesn't it work?

Here is my code.

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

void main() => runApp(RatelApp());

class RatelApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text('RFlutter Alert by Ratel'),
        ),
        body: Home(),
      ),
    );
  }
}



class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  String val = "Deneme";
  showAlertDialog(BuildContext context, Function onPressed) {
    // set up the button
    Widget okButton = FlatButton(
      child: Text(val),
      onPressed: onPressed,
    );

    // set up the AlertDialog
    AlertDialog alert = AlertDialog(
      title: Text("My title"),
      content: Text("This is my message."),
      actions: [
        okButton,
      ],
    );

    // show the dialog
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return alert;
      },
    );
  }
  @override
  Widget build(BuildContext context) {
    return Container(
      child: RaisedButton(
        child: Text("Show Popup"),
        onPressed: () {
          showAlertDialog(context, (){
            setState(() {
              val = "changed";

            });
          });
        },

      ),
    );
  }
}

score 5 · Answer 1 · answered May 23 '20 at 17:59

5

Dialogs are usually stateless and are also not a part of the state of the calling Widget so calling that setState method isn't doing anything for the dialog. To make a dialog that can have changing contents use a StatefulBuilder.

The docs have an example that shows how to use it in a dialog just like in your application.

Docs example:

await showDialog<void>(
  context: context,
  builder: (BuildContext context) {
    int selectedRadio = 0;
    return AlertDialog(
      content: StatefulBuilder(
        builder: (BuildContext context, StateSetter setState) {
          return Column(
            mainAxisSize: MainAxisSize.min,
            children: List<Widget>.generate(4, (int index) {
              return Radio<int>(
                value: index,
                groupValue: selectedRadio,
                onChanged: (int value) {
                  setState(() => selectedRadio = value);
                },
              );
            }),
          );
        },
      ),
    );
  },
);

answered May 23 '20 at 17:59

Christopher Moore

15,626
10
42
52

This doesn't work for me but I found another solution. https://stackoverflow.com/questions/51962272/how-to-refresh-an-alertdialog-in-flutter – Berkay Ceylan May 24 '20 at 21:31
@BerkayCeylan Which answer of that question? The top voted one is identical. – Christopher Moore May 24 '20 at 21:33
@BerkayCeylan That solution is nearly identical. Could you describe why the `StatefulBuilder` solution did not work for you? – Christopher Moore May 25 '20 at 17:01
@BerkayCeylan Please describe the result and share your code that didn't work. – Christopher Moore Jun 02 '20 at 22:13

score 0 · Answer 2 · answered Jan 25 '22 at 09:45

0

You need to wrap your AlertDialog with StatefulBuilder widget.

answered Jan 25 '22 at 09:45

rmontemayor0101

137
2
8

Flutter - Why setstate doesn't work on popup?

2 Answers2