Hello. In today's post I'll touch on using FutureBuilder in Flutter.
In Flutter, FutureBuilder is a Widget we use when working with asynchronous operations.
It consists of two main parts: future and builder.
Future
A Future represents an asynchronous operation that is expected to complete in the future. For example, if we're fetching data from an API, we can represent that with a future.
Builder
The builder lets us create the Widgets we'll draw on screen based on the state of the future object. The Widgets we build inside the builder draw both the view shown while waiting for the data and the view shown after the data arrives.
FutureBuilder(
future: asyncFunction()
builder: (context,snapshot){
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(child: CircularProgressIndicator());
} else {
return Text('have Data');
}
}
);The snapshot object the builder receives has a property that represents four different states. These are:
- none
- waiting
- active
- done
By checking the states of the snapshot object with ConnectionState, you can build the screens you want to show your users.
I'll take the app from the video I recorded on this topic, polish it step by step, and share it on YouTube. You can follow my videos on my YouTube channel. Thanks for reading. Happy coding.