FutureBuilder and StreamBuilder in Flutter

Nikhil Sukhani
2 min readAug 22, 2020

Future Builder is a widget that builds itself from the latest snapshot of interaction with the Future. If you don't know about Future then please refer to this 2-minute article.

https://medium.com/@nikhilsukhani/async-and-await-in-dart-a202dd1d0665

It easily determines the current state of the future and you can choose what to show when the data is loading and when it is available.

Future builder requires 2 parameters :

Future: A method that returns a future object.

Builder: Widgets that will be returned during different states of a future builder.

Check the state of widget with connection state and display an appropriate widget with respect to the state.

FutureBuilder

Finally, it’s a good practice to check that no error has occurred while the future was resolving.

FutureBuilder

There are other connection states that can be used for better performance of the application :

Connection States

Now think you are chatting with a friend. You will not like refreshing or restarting the app every time to check for every new message. This is where StreamBuilder comes into play. Instead of a future as a parameter, it requires stream as a parameter.

StreamBuilder

Here the UI is updated as soon as there is an update in the stream parameter. Rest of the things are the same as FutureBuilder.

You can use StreamBuilder with data from firebase, sensor events, and even network connection status.

If this article helped you in any way, please react with a clap and help it reach a wider audience 😄

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

No responses yet

Write a response