在 Flutter 中未使用 ListView 找到方向性小部件

Question

I tried to show a ListView of the data i gort in my Cloud Firestore Database named Exercises:

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 StatelessWidget {
  final db = FirebaseFirestore.instance;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder<QuerySnapshot>(
        stream: db.collection('Exercises').snapshots(),
        builder: (context, snapshot) {
          if (!snapshot.hasData) {
            return Center(
              child: CircularProgressIndicator(),
            );
          } else
            return ListView(
              children: (snapshot.data! as QuerySnapshot).docs.map((doc) {
                return Card(
                  child: ListTile(
                    title: Text(doc.data()['name']),
                  ),
                );
              }).toList(),
            );
        },
      ),
    );
  }
}

But when i do this i get the Error in my App: Image of the Error

Thank you for your help

Answer 1

Can't Use StreamBuilder directly into the scaffold, Add Column or SinglechildScrollview or Container.

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 StatelessWidget {
  final db = FirebaseFirestore.instance;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(  // Column, Singlechild Scroll view Here
        children: [
          StreamBuilder<QuerySnapshot>(
            stream: db.collection('Exercises').snapshots(),
            builder: (context, snapshot) {
              if (!snapshot.hasData) {
                return Center(
                  child: CircularProgressIndicator(),
                );
              } else
                return ListView(
                  children: (snapshot.data! as QuerySnapshot).docs.map((doc) {
                    return Card(
                      child: ListTile(
                        title: Text(doc.data()['name']),
                      ),
                    );
                  }).toList(),
                );
            },
          ),
        ],
      ),
    );
  }
}

Answer 2

First thank you for your answer. I tried it with the Column and with the SinglechildScrollview, but then i get another Error, that a MediaQuery Widget is missing

MediaQuery Error