Search code examples
flutterflutter-blocflutter-cubit

How to alter state of one screen from another screen using Cubit in Flutter?


I am new to flutter and I am using the Cubit from flutter_bloc package. I have this situation going here.

I have screen-A as in diagram below where I show list of videos and the likes, comments connected with this video.

Now I have screen-B (some kind of detail page) where I have a button that launches screen-C (which is duplicate screen of screen-A) that plays only one video at a time (not scrollable).

So screen-A, screen-B, screen-C are actually different routes and I push these routes as I navigate..

So let's assume:

  • Video1.mp4 is playing right now on Screen and me as a user has not liked or commented on this video.

  • Then I open Screen B. Tap on a button that opens the same video1.mp4 on screen C.

  • Then I tap the like button to add my 'like' on this video.

  • Now I navigate back from Screen C -> Screen B -> Screen A.

  • Since the same video is playing here, I want the 'like count' to be updated with +1 count and the button has to be in 'liked' state.

The problem is I have no idea how to update this state from another screen.

enter image description here


Solution

  • In this situation, I will provide the Cubit or the Bloc at the top of the widget tree (above the MaterialApp) and use it in screens A and C to change the state. Thus, both screens will listen to the changes and be updated with the BlocBuilder.