I cant update the UI or widgets even with the StatefulWidget

Question

I want to update the height of the first alertDialog right after I press the "increse the height" in the secoundDialog but it didn't change

this is my code:

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});
  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  // this is the firt value of the height
  double heightSize = 200;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: FloatingActionButton(
        onPressed: () async {
          setState(() {
            print('the size0 is $heightSize');

            showDialog(
              context: context,
              builder: (context) {
                return StatefulBuilder(
                  builder: (context, setState) {
                    return AlertDialog(
                      title: Container(
                        padding: EdgeInsets.only(
                            left: 10, right: 10, top: 5, bottom: 4),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              'Download File',
                              style: TextStyle(
                                  color: Color.fromARGB(255, 83, 82, 82),
                                  fontSize: 20),
                            ),
                          ],
                        ),
                      ),
                      content: Container(
                        // I want to change to 500 right after I press the button
                        height: heightSize,
                        child: Column(
                          children: [
                            IconButton(
                                onPressed: () {
                                  setState(() {
                                    print('the size1 is $heightSize');
                                    showDialog(
                                      context: context,
                                      builder: (context) {
                                        return StatefulBuilder(
                                          builder: (context, setState) {
                                            return AlertDialog(
                                              content: GestureDetector(
                                                child: Text(
                                                    'increase the height '),
                                                onTap: () {
                                                  setState(() {
                                                    // this is the button I want to change to 500
                                                    heightSize = 500;
                                                    print(
                                                        'the size2 is $heightSize');

                                                    Navigator.pop(context);
                                                  });
                                                },
                                              ),
                                            );
                                          },
                                        );
                                      },
                                    );
                                  });
                                },
                                icon: Icon(FontAwesomeIcons.paste))
                          ],
                        ),
                      ),
                    );
                  },
                );
              },
            );
          });
        },
      ),
    );
  }
}

if I close the two of the alert-dialog and press floating button it work but I want to change right after I press the increase Size button

I try the set state but it doesnt work

Answer 1

Try to use async method like

onPressed: () async {
  await showDialog(...);
  setState(() {});
  print('the size1 is $heightSize');
},

---

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});
  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
 
  double heightSize = 200;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: FloatingActionButton(
        onPressed: () async {
          setState(() {
            print('the size0 is $heightSize');

            showDialog(
              context: context,
              builder: (context) {
                return StatefulBuilder(
                  builder: (context, setState) {
                    return AlertDialog(
                      title: Container(
                        padding: EdgeInsets.only(
                            left: 10, right: 10, top: 5, bottom: 4),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              'Download File',
                              style: TextStyle(
                                  color: Color.fromARGB(255, 83, 82, 82),
                                  fontSize: 20),
                            ),
                          ],
                        ),
                      ),
                      content: Container(
                        // I want to change to 500 right after I press the button
                        height: heightSize,
                        child: Column(
                          children: [
                            IconButton(
                                onPressed: () async {
                                  await showDialog(
                                    context: context,
                                    builder: (context) {
                                      return StatefulBuilder(
                                        builder: (context, setState) {
                                          return AlertDialog(
                                            content: GestureDetector(
                                              child:
                                                  Text('increase the height '),
                                              onTap: () {
                                                setState(() {
                                                  // this is the button I want to change to 500
                                                  heightSize = 500;
                                                  print(
                                                      'the size2 is $heightSize');

                                                  Navigator.pop(context);
                                                });
                                              },
                                            ),
                                          );
                                        },
                                      );
                                    },
                                  );

                                  setState(() {});
                                  print('the size1 is $heightSize');
                                },
                                icon: Icon(Icons.paste))
                          ],
                        ),
                      ),
                    );
                  },
                );
              },
            );
          });
        },
      ),
    );
  }
}