title: How to get all sub collection data to Widget with StreamBuilder in Firebase + Firestore + Flutter
body: <p>In flutter, I use Firebase Firestore to save data. I created the root collection as <strong>Users</strong> and in that collection, each user has a subcollection named by <strong>Books</strong>.</p>
  <p>This is my Firebase Cloud Firestore</p>
  <p><a href="https://i.stack.imgur.com/ESUUr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ESUUr.png" alt="enter image description here" /></a></p>
  <p>I tried to get all users all books with a button click as below</p>
  <pre><code>getUserBooks() {
    FirebaseFirestore.instance.collection(&quot;Users&quot;).get().then((querySnapshot) {
      querySnapshot.docs.forEach((result) {
        FirebaseFirestore.instance
            .collection(&quot;Users&quot;)
            .doc(result.id)
            .collection(&quot;Books&quot;)
            .get()
            .then((querySnapshot) {
          querySnapshot.docs.forEach((result) {
            BooksModel booksModel = BooksModel.fromDocument(result);
  
            print(&quot;--------------------- Books ---------------------\n&quot;
                &quot;id: ${booksModel.bookID}\n&quot;
                &quot;name: ${booksModel.bookName}\n&quot;
                &quot;image: ${booksModel.bookImage}&quot;);
          });
        });
      });
    });
  }
  </code></pre>
  <p>This is model class</p>
  <pre><code>class BooksModel {
    final String bookID;
    final String bookName;
    final String bookImage;
  
    BooksModel({
      this.bookID,
      this.bookName,
      this.bookImage,
    });
  
    factory BooksModel.fromDocument(DocumentSnapshot documentSnapshot) {
      return BooksModel(
        bookID: documentSnapshot['bookID'],
        bookName: documentSnapshot['bookName'],
        bookImage: documentSnapshot['bookImage'],
      );
    }
  }
  </code></pre>
  <p>I used the below code to get the book details according to a single user but <strong>I want to get all users books details to that widget</strong>. How can I change the code?</p>
  <pre><code>_usersBookListWidget() {
    return Container(
      height: MediaQuery.of(context).size.height,
      child: StreamBuilder&lt;QuerySnapshot&gt;(
        stream: FirebaseFirestore.instance
            .collection(&quot;Users&quot;)
            .doc(userID)
            .collection('Books')
            .snapshots(),
        builder: (context, snapshot) {
          return !snapshot.hasData
              ? Container()
              : snapshot.data.docs.length.toString() == &quot;0&quot;
              ? Container(
            height: 250.0,
            width: 200.0,
            child: Column(
              children: [
                SizedBox(
                  height: 30.0,
                ),
                Text(
                  &quot;You have no books yet&quot;,
                  style: TextStyle(
                      fontSize: Theme.of(context)
                          .textTheme
                          .headline6
                          .fontSize),
                ),
                Image.asset(
                  'assets/icons/icon_no_books_yet.png',
                  height: 100.0,
                  width: 100.0,
                ),
              ],
            ),
          )
              : ListView.builder(
            scrollDirection: Axis.vertical,
            physics: BouncingScrollPhysics(),
            itemCount: snapshot.data.docs.length,
            itemBuilder: (BuildContext context, int index) {
              BooksModel booksModel =
              BooksModel.fromDocument(snapshot.data.docs[index]);
              return Column(
                children: [
                  Text(booksModel.bookID),
                  Text(booksModel.bookName),
                ],
              );
            },
          );
        },
      ),
    );
  }
  </code></pre>