首页 > 解决方案 > 如何使用流构建器从我的消息集合中的最后一个消息字段返回消息

问题描述

请我需要流生成器小部件来返回我的消息集合中的最后一条消息(红色矩形框)。我在下面使用的返回一个空字符串必须在 Text 小部件中提供。

        class MessageScreen extends StatefulWidget {
          final String uid;
          MessageScreen(this.uid);
          @override
          _MessageScreenState createState() => _MessageScreenState();
        }
        
        class _MessageScreenState extends State<MessageScreen> {
          String uid;
          @override
          Widget build(BuildContext context) {
            return Scaffold(
              appBar: AppBar(
                elevation: 0.0,
                title: Center(
                  widthFactor: 5,
                  child: Text(
                    'Message',
                    style: mystyle(
                      20.0,
                      Style.Colors.titleColor,
                    ),
                  ),
                ),
              ),
              body: LastMessageContainer(
                  stream:
                      messageCollection.orderBy('lastMessage.timestamp', descending: true).where('users', arrayContains: uid).snapshots()),
            );
          }
        }
        
        class LastMessageContainer extends StatelessWidget {
          final stream;
        
          LastMessageContainer({
            @required this.stream,
          });
        
          @override
          Widget build(BuildContext context) {
            return StreamBuilder(
              stream: stream,
              builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
                if (snapshot.hasData) {
                  var docList = snapshot.data.docs;
        
                  if (docList.isNotEmpty) {
                    Message message = Message.fromMap(docList.last.data());
                    return SizedBox(
                      width: MediaQuery.of(context).size.width * 0.6,
                      child: Text(
                        message.message,
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                          color: Colors.grey,
                          fontSize: 14,
                        ),
                      ),
                    );
                  }
                  return Text(
                    "No Message",
                    style: TextStyle(
                      color: Colors.grey,
                      fontSize: 14,
                    ),
                  );
                }
                return Text(
                  "..",
                  style: TextStyle(
                    color: Colors.grey,
                    fontSize: 14,
                  ),
                );
              },
            );
          }
         }
         ```

   

消息集合截图]

当我尝试从消息集合下的最后一个消息字段中获取消息时,它返回的错误(即必须在 Text 小部件中提供空字符串)发生在 Text(message.message) 中。

标签: flutterflutter-layout

解决方案


首先,您必须将时间戳存储在生成消息的位置。之后,您可以简单地在您的集合上调用“orderBy”并按时间戳对其进行排序。


推荐阅读