2

I am working on a statefulWidget and my purpose is to make sure that the next button is not clickable until an option (in this language is selected). However it doesn't seem to work, I also added Yaesin's(Someone who answered) answer to the code

 ListView.builder(
            itemCount: histoires.length,
            itemBuilder: (context, index) {
              return ListTile(
                  title: Text(
                    histoires[index].title,
                    style: TextStyle(color: Colors.pink),
                  ),
                  trailing: IconButton(
                      icon: Icon(Icons.play_arrow),
                      onPressed: () {
                        showDialog(
                            context: context,
                            builder: (BuildContext context) {
                              return StatefulBuilder(
                                  builder: (context, setState) =>
                                      AlertDialog(
                                        content: Column(children: [
                                          InkWell(
                                              onTap: () {
                                                _handleTap;
                                              },
                                              child: ListTile(
                                                  trailing: Icon(Icons
                                                      .flag_circle_rounded),
                                                  title: Text(
                                                    "French",
                                                    style: TextStyle(
                                                        color: Colors
                                                            .blueGrey),
                                                  ))),
                                          _active
                                              ? InkWell(
                                                  onTap: () {},
                                                  child: Image.asset(
                                                      "assets/nextactive.png",
                                                      height: height * 0.2,
                                                      width: width * 0.4),
                                                )
                                              : Image.asset(
                                                  "assets/nextinactive.png",
                                                  height: height * 0,
                                                  width: width * 0)
                                        ]),
                                      ));
                            });
                      }));
            }),
Blue M
  • 65
  • 6

2 Answers2

3

To update dialog UI, you can use StatefulBuilder's setState

 return StatefulBuilder(
    builder: (context, setState) =>  
      AlertDialog(
          content: Column(children: [

While using separate method, pass the StatefulBuilder's setState to the function. For your case, it will be

onPressed: () async {
  await showDialog(
      context: context,
      builder: (BuildContext context) {
        return StatefulBuilder(
            builder: (context, setStateSB) => AlertDialog(
                  content: Column(children: [
                    InkWell(
                        onTap: () {
                          _handleTap(setStateSB);
                        },
                        child: ListTile(

Also make sure to receive this setStateSB(renamed to avoid confusion with state's setState).

_handleTap(setStateSB){ ....

More about using StatefulBuilder

Md. Yeasin Sheikh
  • 54,221
  • 7
  • 29
  • 56
2

Since your in a Dialog, for setState to work, you need to wrap it with a StatefulBuilder.

You haven't included your full code, so I'm using this example taken from the docs:

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

See also

A YouTube video by the Flutter team explaining StatefulBuilder

MendelG
  • 14,885
  • 4
  • 25
  • 52
  • Hi, thanks for answering, I tried your method, it didn't work for me. Can you take a look at the edited code where I tried someone's with similar answer to yours? – Blue M Dec 29 '22 at 21:10
  • @BlueM Can you update the code again with the _complete_ code? I don't see you using `setState` anywhere. Or setting `active` – MendelG Dec 29 '22 at 21:24
  • I did at the top : bool _active = false; void _handleTap() { setState(() { _active = !_active; }); } – Blue M Dec 30 '22 at 01:35