Search code examples
flutterdartstatefulwidget

Issue with statefulWidget unable to make desired changes


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

Solution

  • 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