想法很简单(实时聊天)。我的StreamBuilder
有一个ListView.builder
,并且已连接到 Firebase实时数据库。如果现在有一个新元素出现,我希望它从底部到其位置被“动画化”(请参阅WhatsApp)。不,我不想使用FirebaseAnimatedList
。
StreamBuilder(
stream: _queryDatabase.onValue,
builder: (BuildContext context, snapshot) {
if (snapshot.hasData) {
if (snapshot.data.snapshot.value != null) {
//final int documentsLength = snapshot.data.documents.length;
Map<dynamic, dynamic> map =
snapshot.data.snapshot.value;
List<dynamic> list = map.values.toList()
..sort((a, b) =>
b['timestamp'].compareTo(a['timestamp']));
final int listLength = map.values.toList().length;
return ListView.builder(
padding: const EdgeInsets.all(8.0),
physics: const AlwaysScrollableScrollPhysics(),
controller: _scrollController,
itemCount: listLength,
reverse: true,
itemBuilder: (context, int index) {
return new ChatMessage(
snapshot: list,
index: index,
userId: widget.userId,
groupId: widget.groupId,
admins: widget.admins,
singleChat: false,
bannedUsers: widget.bannedUsers);
});
} else {
return Container(
child: Center(
child: Text(
'Poste die erste Chatnachricht.',
style: TextStyle(fontSize: 20.0, color: Colors.grey),
textAlign: TextAlign.center,
)));
}
} else {
return Center(child: CircularProgressIndicator());
}
},
)