Flutter StreamBuilder<QuerySnapshot> and build List is not working

Question

I want to create list of datas from firebase database, but it is not display on screen. even there is no error message, so I can't get how to figure out.

here is my StreamBuilder code :

return StreamBuilder<QuerySnapshot>(
      stream: _firestore.collection('Goals').orderBy('timestamp').snapshots(),
      builder: (context, snapshot) {
        if (!snapshot.hasData) {
          return const Center(
            child: CircularProgressIndicator(
              backgroundColor: lightHoney,
            ),
          );
        } else {
          final goals = snapshot.data?.docs;
          List<GoalComb> goalDatas = [];
          for (var goal in goals!) {
            final goalTitle = goal.get('goalTitle');
            final goalWriter = goal.get('writer');
            final goalCompleted = goal.get('goalCompleted');
            final goalTime = goal.get('timestamp');

            final goalComb = GoalComb(
                goalTitle: goalTitle,
                goalWriter: goalWriter,
                goalCompleted: goalCompleted,
                goalStart: goalTime);
            goalDatas.add(goalComb);
          }
          return Expanded(
            child: ListView(
              padding:
                  const EdgeInsets.symmetric(horizontal: 10.0, vertical: 20.0),
              children: goalDatas,
            ),
          );
        }
      },
    );

Below is GoalComb code :

class GoalComb extends StatelessWidget {
  const GoalComb({
    super.key,
    required this.goalTitle,
    required this.goalWriter,
    required this.goalCompleted,
    required this.goalStart,
  });

  final String goalTitle;
  final String goalWriter;
  final bool goalCompleted;
  final int goalStart;

  @override
  Widget build(BuildContext context) {
    int goalIndex = goalStart + 1;
    return Padding(
      padding: const EdgeInsets.only(
        left: 25.0,
        right: 25.0,
        top: 25.0,
      ),
      child: ElevatedButton(
        style: ElevatedButton.styleFrom(
          padding: const EdgeInsets.all(24.0),
        ),
        onPressed: () {
          Navigator.of(context).push(MaterialPageRoute(
              builder: (context) => HoneycombScreen(
                    goalComb: GoalComb(
                      goalTitle: goalTitle,
                      goalWriter: goalWriter,
                      goalCompleted: goalCompleted,
                      goalStart: goalIndex,
                    ),
                  )));
        },
        child: Column(
          children: [
            Text(
              goalTitle,
            ),
            Text(
              '$goalIndex',
            )
          ],
        ),
      ),
    );
  }
}

I was studying chat application. So I copy the way of code that displaying message bubble on chat screen. But this case is not working. only white screen on emulator.

below is my firebase database

Answer 1

even there is no error message, so I can't get how to figure out.

That may well be because your builder is ignoring errors in the snapshot. You should always handle snapshot.hasError and an easy way is like this:

builder: (context, snapshot) {
  if (snapshot.hasError) return Text('ERROR: ${snapshot.error}'); // 
  if (!snapshot.hasData) {
    ...