Animate добавил / удалил элемент в Listview.Builder в сочетании с StreamBuilder - PullRequest
0 голосов
/ 31 марта 2019

Идея довольно проста (чат в реальном времени). Мой StreamBuilder имеет ListView.builder и подключен к База данных Firebase Realtime . Если теперь появляется новый элемент, я хочу, чтобы он был «анимирован» снизу до его позиции (см. 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());
                    }
                  },
                )
...