Berkay Ceylan
Berkay Ceylan

Reputation: 11

Flutter - Why setstate doesn't work on popup?

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";

            });
          });
        },

      ),
    );
  }
}

Upvotes: 0

Views: 1784

Answers (2)

rmontemayor0101
rmontemayor0101

Reputation: 156

You need to wrap your AlertDialog with StatefulBuilder widget.

Upvotes: 0

Christopher Moore
Christopher Moore

Reputation: 17113

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);
                },
              );
            }),
          );
        },
      ),
    );
  },
);

Upvotes: 5

Related Questions