Stop listening to a stream after going to the next screen

Issue

i have a stream which takes data from firebase and when a specific field in firestore changes my app Navigates to next screen (I'm listening to that field in build method) but after reaching to next screen if that value changes again the screen where i was navigated to relaunches itself. How do i stop listening to stream once i am navigated to next stream.

The thing i want to achieve to open a new screen when a value in firestore changes to true. here is my code

 gameProvider.getRoomData().listen((e) {
  Map a = e.data() as Map<String, dynamic>;
  if (a['gameRunning']) {
    Navigator.of(context).push(MaterialPageRoute(
      builder: (context) => GameplayScreen(),
    ));
    
  }
});

getRoomData is the stream i'm listening to and gameRunning is the bool i wanna see if it becomes true i want to navigate to new screen but once i'm there i don't want to listen it's changes

Solution

Create a StreamSubscription field and assign it your stream, like:

late StreamSubscription _subscription;

Now, pause the stream before navigating to second screen and resume if after coming back from there:

_subscription = yourStream.listen((e) async {
  if (yourBoolCondition) {
    // Pause the subscription before navigating to another screen.
    _subscription.pause();

    // Navigate to the second screen
    await Navigator.of(context).push(MaterialPageRoute(
      builder: (context) => GameplayScreen(),
    ));

    // Resume the subscription after you have come back to this screen.
    _subscription.resume();
  }
});

Answered By - CopsOnRoad