Flutter Stream Builder

Hey, Guys hope you all are doing in today's blog we going to see how to use a stream builder, what is a stream builder and how to implement it. This blog will be going to the continuation of the last blog I wrote on flutter Linux in which we run Linux command and get output from firebase bu in that what if we have a large team all run command and you are an administrator you have to keep eye on the system what command users are running so here Stream builder come in play I request if you no saw that blog please go and read it first I will provide a link below.

What is Stream Builder?

Stream builder basically something That rebuilds itself as soon as new data come.

For example, you have set one point where new data is coming continuously that point set data to the app continuously and as soon as new data come to the app they rebuild themself with new data in this manner we can say that one stream is set between our app and endpoint.

Let's understand how to implement a stream builder in our last Linux app.

import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';

void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();

runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
// Firebase.initializeApp();
// Firebase.initializeApp();
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("Linux APP"),
),
body:
StreamBuilder(
stream: FirebaseFirestore.instance.collection('date command').snapshots(),
builder: (context, snapshot) {
return ListView.builder(
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
DocumentSnapshot data = snapshot.data.documents[index];
return ListTile(
title: Text(data['output']),
);
},
);
},
)
),
);
}
}

In the above code, all things are the same only change is in body keyword there we use StreaemBuilder.

Let's understand that

StreamBuilder(
stream: FirebaseFirestore.instance.collection('date command').snapshots(),
builder: (context, snapshot) {
return ListView.builder(
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
DocumentSnapshot data = snapshot.data.documents[index];
return ListTile(
title: Text(data['output']),
);
},
);
},
)

Here we set out the stream to firestore collection name date command after that we use builder which keep track and as soon as data ot will rebuild that part inside it we use list view.

Now from the above code as soon as we change something in the collection date command it changes in our app in no time it's like live changes will take place as shown below.

Below is our firebase as soon as we change something in firebase it will change in the app too.

Below I am providing a Github repo that contains this code as well as the last blog code too so that you can differentiate easily.

Guys, here we come to the end of this blog I hope you all like it and found it informative.

Here is the git hub repo https://github.com/guptaadi123/Linuxapp.git

Guys follow me for such amazing blogs and if have any review then please let me know I will keep those points in my mind next time while writing blogs. If want to read more such blog to know more about me here is my website link https://sites.google.com/view/adityvgupta/home.Guys Please do not hesitate to keep 👏👏👏👏👏 for it (An Open Secret: You can clap up to 50 times for a post, and the best part is, it wouldn’t cost you anything), also feel free to share it across. This really means a lot to me.

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

STL map/unordered_map with a Vector for the Key

Get that POST Request Working by Enabling CORS on an Express Backend to Chat w/Ur React Frontend

Powerful Developer features

Go Rant: Buffered Channels Should be Tossed in a Fire

Automatic Type Class Derivation with Shapeless — Part Three

Task Description📄

GSoC Project Report : Improve LibreCores.org in Terms of Discoverability

LaTeX: overhyped or still a gem

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Gupta Aditya

Gupta Aditya

More from Medium

Floor Package | Notes App Example

Floor Package Image

Custom Option Selection Widget — Flutter.

Flutter Timer: Piva — Localization, Notification, Managing State - Part 3

Control Flow statement on Dart — Dart Programming — Part 6