Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create streambuilder and listview with Firebase Realtime database data (Flutter chat app)

I'm building a flutter chat app for my personal learning project where the data will be retrieved from Firebase Realtime database.

I got this code from a tutorial but it is showing errors. How to solve this?

StreamBuilder(
      stream: dbRef.onValue,
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          print("Error on the way");
          messages.clear();
          DataSnapshot dataValues = snapshot.data.snapshot; //Error: The getter snapshot is not defined for the type 'Object';
          Map<dynamic, dynamic> values = dataValues.value;
          values.forEach((key, values) {
            messages.add(values);
          });
          return new ListView.builder(
            shrinkWrap: true,
            itemCount: messages.length,
            itemBuilder: (BuildContext context, int index) {
              return Card(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text("Name: " + messages[index]["Text"]),
                    Text("Time: " + messages[index]["TextTime"]),
                  ],
                ),
              );
            },
          );
        }
      },
    ),
like image 942
Tasnim Ur Rahaman Anas Avatar asked Feb 23 '26 05:02

Tasnim Ur Rahaman Anas


1 Answers

This solved the problem.

StreamBuilder(
                stream: _dbRef.onValue,
                builder: (context, snapshot) {
                  List<Message> messageList = [];
                  if (snapshot.hasData &&
                      snapshot.data != null &&
                      (snapshot.data! as DatabaseEvent).snapshot.value !=
                          null) {
                    final myMessages = Map<dynamic, dynamic>.from(
                        (snapshot.data! as DatabaseEvent).snapshot.value
                            as Map<dynamic, dynamic>); //typecasting
                    myMessages.forEach((key, value) {
                      final currentMessage = Map<String, dynamic>.from(value);
                      messageList.add(Message(
                          author: currentMessage['Author'],
                          authorId: currentMessage['Author_ID'],
                          text: currentMessage['Text'],
                          time: currentMessage['Time'],));
                    }); //created a class called message and added all messages in a List of class message
                    return ListView.builder(
                      reverse: true,
                      itemCount: messageList.length,
                      itemBuilder: (context, index) {
                        return ChattingDesign(
                          message: messageList[index],
                          dbpathToMsgChnl:
                              'TextChannels/${widget.channels['ChannelName']}/Messages',
                          showName: shouldShowName(
                            index,
                            messageList.length - 1,
                            messageList,
                          ),
                        );
                      },
                    );
                  } else {
                    return Center(
                      child: Text(
                        'Say Hi...',
                        style: TextStyle(
                            color: Colors.white,
                            fontSize: 21,
                            fontWeight: FontWeight.w400),
                      ),
                    );
                  }
                },
              ),
like image 69
Tasnim Ur Rahaman Anas Avatar answered Feb 26 '26 05:02

Tasnim Ur Rahaman Anas



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!