Introduction

I wrote this series with the aim of sharing knowledge about Bloc Pattern in Flutter. Since it is related to the knowledge of asynchronous programming like Stream, I decided to go from root to top.

This series will include 3 main contents:

Part 1 : Stream, the concepts related to Stream such as Stream Controller, Subscription, … Because understanding Stream, you can understand RxDart and Bloc Pattern. If you already understand the concept of Stream please go straight to the sequel to this series.

Part 2 : RxDart (need knowledge about Stream in part 1)

Part 3 : Bloc Pattern (need knowledge of Stream in part 1)

Okay, now we’re going to start with part 1 of the Tream Touch.

1. What is Stream, What is Event

You can imagine this carousel as a Stream .

Definition verbatim from doc:

A stream is a sequence of asynchronous events

Literally translated, Stream is a series of asynchronous events . The blocks that are skating on the ice are events . Event can be a data , can also be an error , or a done state (In the Create Stream below I will say more clearly). These events are processed asynchronously. Thus a Stream is a series of events are processed asynchronously.

In fact, it’s not streamed forever like the gif. It can be created, can also be closed and we can also pause the conveyor (pause) and resume the belt to run (resume).

During data transmission, it is possible to go through some intermediate processing stages before reaching the consumer. As shown in the image below, the input data is chữ thường through a processing function called map to output the output data in capital chữ in hoa . Such functions are, however, limited in the Stream class of Dart. That’s why we need RxDart – a library that adds extra power to Stream .

If you have ever known RxJava or RxJs, … then the definition of Stream is the definition of Observable in Rx.

2. Create Stream, listen to Stream and explain terminology

What is emit

The act of broadcasting Event of the Stream is called emit

Create Stream

There are many ways to create a stream. Here I temporarily introduce the easiest way to explain the term.

Here I have created a Stream and emit 1 data is ‘teddy bear’ but when running the program, nothing happens. It’s because I gave out a ‘teddy bear’ but no one accepted it. To receive a teddy bear, you must subscribe to Stream to receive it when the ‘teddy bear’ is released. Next we will proceed to subscribe to Stream on (subscribe a Stream).

Subscribe a Stream

We use the listen to subscribe to events from the stream.

Output:

In RxJava, …, this lambda is also called (event) { print('Tôi đã nhận được $event'); } is 1 Observer

In the listen we have additional optional parameters such as onDone , onError

A Stream when emit finishes all events, it will emit the event on onDone , if an error is encountered it will emit an error and onError will help us get that event.

Output: Since there was no error, the output will look like this.

More ways to create Stream

Now I will introduce more ways to create Stream more:

• Create a Stream at the same time emit 1 error and done always.

Output:

• Create a Stream and emit 1 List data finished then Done.

Output:

• Create a Stream from 1 Future .

Output:

• Creating a stream every 1 second will emit an event. You note that the error is also an event so when the Stream emit generates an error, the Stream does not stop.

Output:

This stream is immortal. Now I will use StreamSubscription to slay it, make it invulnerable!

3. What is StreamSubscription

The listen above will return a StreamSubscription object. StreamSubscription helps us to control the stream. We can pause stream, resume stream, and cancel the stream.

Output:

And we were able to stop the immortal stream above successfully by cancel() function. People often call this action unsubscribe một Stream .

4. Stream Builder, async *, yield and yield *

In fact, people rarely use the above methods to create streams but they use the so-called stream builder , where they can emit data any time they want.

To create a stream builder we create a function with async* and return a Stream . To emit a data we can use yield , to emit all data in a stream we can use yield*

Output:

Conclude

Through part 1 of this series, hopefully you have grasped the important terms in Stream as well as in Dart’s asynchronous programming. These terms are crucial for the next series in this series. In the next article, I will introduce you to the Stream and Stream Controller, Broadcast Stream operators. Hope you guys read.

Reference source: https://dart.dev/tutorials/language/streams