Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – Is there a proper replacment for WillPopScope rather than PopScope?

I had made a chatting application but I am having problems in it’s chatting screen because I am using emoji_picker_flutte package to show a emoji board,and I had implemented it such that whenever the emoji board was on the a bool varaible was true and vice varsa and if ther user uses back navigation gesture first the emoji board will disapper then if the user uses back navigation gesture again then the page will pop.

When using WillPopScope there was no issue, but recently with PopScope it dosen’t, I have tried placing the whole code in onPopInvoked just as migration said with canPop set to false but it dosen’t work.
I also tried using the whole code into seprate function with the return type as bool and using thet function on canPop but it failed because canPop is running all the time while that page is on while using this way the emoji board dosen’t even appear and because as the emoji button is pressed and the variable turns true it immediately becomes false while everything is working normally.

bool _willpop() {
    if (_showEmoji) {
      setState(() => _showEmoji = !_showEmoji);
      return false;
    } else {
      return true;
    }
  }


PopScope (
canPop = _willpop();
child:...
)

Other way

_willpop(bool p) {
    if (p) return;
    if (_showEmoji) {
      change();
      return false;
    } else {
      return true;
    }
  }

PopScope (
canPop: false,
onPopInvoked: (didpop) => _willpop(didpop),
child:...
)

both of the ways don’t work can anyone suggest a better way for this

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I found the solution, here is the solution and it works as I wanted

      bool _showEmoji = false;

  void change() => setState(() => _showEmoji = !_showEmoji);

  bool _willpop() {
   if (_showEmoji) {
     change();
     return false;
   } else {
     return true;
   } 
  }

  PopScope(
  canPop: !_showEmoji,
  onPopInvoked: (didpop) => _willpop(),
  child:...,
  ),

  2. 0

    In the second way if p is true don’t return anything. Just remove that line.

    if (p) return;

    Now if _showEmoji is true just reverse its value and called setState but if it is false use Navigator.pop(context) to pop

    _willpop(bool p) {
    if (_showEmoji) {
      change();
    } else {
      Navigator.pop(context);
    }
  }

    Why your first method is not working might be because when you set _showEmoji=true, you did not called the setState(), so new PopScope widget did not build with canPop as false but still as true, which allows user to go back.

    But my advice do not uses first method because this method is called when widget build, and you are calling setState() on widget build which rebuild the widget again if condition matches. If conditions are not handled properly it will cause widget to rebuild again and again.

    That’s why use second method, which only call when user really tries to go back , not on widget build.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search