Flutter : willpopScope is not working in appBar back button

Question

Here I am using will pop scope. But in appBar back button WillPopScope is not working.

here when stockListData is not empty then anyone want to go back previous page then i want willPOPScope dialog message, here This is working fine for device back button but i Want same thing on appBar back button too. How to make it workable?

---

here when stockListData is not empty then anyone want to go back previous page then i want willPOPScope dialog message, here This is working fine for device back button but i Want same thing on appBar back button too.

This is my code.

return WillPopScope(
      onWillPop: () async {
        if (selectedIndex == 3 && stockListData.length != 0) {
          final value = await showDialog<bool>(
              context: context,
              builder: (context) {
                // Widget cancelButton = FlatButton(
                //   color: Colors.black,
                //   child: Text(
                //     "No",
                //     style: TextStyle(color: Colors.white),
                //   ),
                //   onPressed: () {
                //     Navigator.of(context).pop(false);
                //   },
                // );
                Widget continueButton = FlatButton(
                    color: Colors.black,
                    child: Text(
                      "OK",
                      style: TextStyle(color: Colors.white),
                    ),
                    onPressed: () {
                      Navigator.of(context).pop(true);
                    });

                return AlertDialog(
                  titlePadding: EdgeInsets.only(top: 13),
                  title: Container(
                    height: 40,
                    child: Center(
                      child: Text(
                        "Alert",
                        style: TextStyle(color: blackColor),
                      ),
                    ),
                    // color: Color(0xff007669),
                  ),
                  content: Text(
                    "If you leave this page then your added stock will be deleted.",
                    textAlign: TextAlign.center,
                    style: TextStyle(fontSize: 12),
                  ),
                  actions: [
                    // cancelButton,
                    continueButton,
                  ],
                  actionsAlignment: MainAxisAlignment.center,
                );
              });
          return value == true;
        } else {
          setState(() {Navigator.of(context).pop(true);});
          return false;
        }
      },
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          title: Text(
            "Portfolio Review",
            style: TextStyle(fontSize: tSize16),
          ),
          leading: Builder(
            builder: (BuildContext context) {
              return IconButton(
                icon: Icon(Icons.arrow_back_ios_rounded),
                onPressed: () {
                  Navigator.pop(context);
                },
                tooltip: '',
              );
            },
          ),
          elevation: 0,
          backgroundColor: skyBlue,
        ),
        body: SingleChildScrollView());

Answer 1

have you addd automaticallyImplyLeading: false in App-bar

Answer 2

In the app bar you are directly popping the screen. Extraxt the method of will pop scope

            builder: (BuildContext context) {
              return IconButton(
                icon: Icon(Icons.arrow_back_ios_rounded),
                onPressed: () {
                  Navigator.pop(context);//call the extracted method here
                },
                tooltip: '',
              );
            },
          ),

And in place of navigator.pop use that extracted method..

Also just a suggestion you dont have to setstate a navigator.pop or navigator.push.