Flutter: Stream shows results in a flash

Question

In my app, I have a home screen which has a BottomNavigationBar. In one of the bottomNavBars I need to stream a ListViewBuilder. But the StreamBuilder shows the results in a flash and disappears again. Please check my code and see what's wrong with it.

This is my code:

final uid = FirebaseAuth.instance.currentUser!.uid;
  QueryDocumentSnapshot<Map<String, dynamic>>? selectedRide;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: StreamBuilder(
          stream: FirebaseFirestore.instance
              .collectionGroup("collectionGroup")
              .where("PassUID", isEqualTo: uid)
              .snapshots(),
          builder: (context, snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting) {
              return const Center(
                child: CircularProgressIndicator(),
              );
            }
            if (snapshot.hasData) {
              final request = snapshot.data?.docs;
              return ListView.builder(
                itemCount: snapshot.data?.docs.length,
                itemBuilder: (context, index) {
                  final currentrequest = request![index];
                  // final currentID = currentrequest.get('PassUID');

                  return Card(
                    color: Colors.grey.shade600,
                    child: ListTile(
                      onTap: () {
                        setState(() {
                          selectedRide = snapshot.data!.docs[index];
                        });
                        Navigator.push(
                            context,
                            MaterialPageRoute(
                                builder: (context) => NavigateToThisScreen(
                                      selectedRide: selectedRide,
                                    )));
                      },
                      title: //rest of logic
                  );
                },
              );
            }
            if (!snapshot.hasData) {
              return const Center(
                child: SizedBox(
                  child: Text(
                    "text",
                    style: TextStyle(color: Colors.white),
                  ),
                ),
              );
            }

            return const SizedBox();
          }),
    );
  }

Answer 1

The reason for the flash is the last return statement return const SizedBox() at the end of the builder method. Note: I have also removed the unnecessary if(!snapshot.hasData) statement and replaced it with the else branch of the if(snapshot.hasData) statement.

Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.black,
    body: StreamBuilder(
        stream: FirebaseFirestore.instance
            .collectionGroup("collectionGroup")
            .where("PassUID", isEqualTo: uid)
            .snapshots(),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
            return const Center(
              child: CircularProgressIndicator(),
            );
          }
          if (snapshot.hasData) {
            final request = snapshot.data?.docs;
            return ListView.builder(
              itemCount: snapshot.data?.docs.length,
              itemBuilder: (context, index) {
                final currentrequest = request![index];
                // final currentID = currentrequest.get('PassUID');

                return Card(
                    color: Colors.grey.shade600,
                    child: ListTile(
                    onTap: () {
                  setState(() {
                    selectedRide = snapshot.data!.docs[index];
                  });
                  Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => NavigateToThisScreen(
                            selectedRide: selectedRide,
                          )));
                },
                title: //rest of logic
                );
              },
            );
          } else {
            return const Center(
              child: SizedBox(
                child: Text(
                  "text",
                  style: TextStyle(color: Colors.white),
                ),
              ),
            );
          }
        }),
  );
}