ListView Items 被键盘覆盖或在新项目到达时跳起来答案

【问题标题】：ListView Items covered by keyboard or jump up when new items arriveListView Items 被键盘覆盖或在新项目到达时跳起来
【发布时间】：2021-02-11 14:17:33
【问题描述】：

我正在构建一个以 Firestore 作为后端的聊天应用程序，例如 WhatsApp。我的聊天 UI 由一个 Scaffold、一个 AppBar、一个 ListView 和一个底部带有发送按钮的输入字段组成。列表视图只是在 Firestore 中显示 messages 集合的流。

这是ListView的代码

Column(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    Flexible(
      fit: FlexFit.loose,
      child: ListView.builder(
        controller: _scrollController,
        reverse: true,
        shrinkWrap: true,
        itemCount: _messages.length,
        itemBuilder: (context, index) {
          return ChatMessageTile(
            message: _messages[index],
          );
        },
      ),
    ),
    InputBar(
      isActive: _activeChat.chat?.isActive,
      callback: (String msg) async {
        _activeChat.sendChatMessage(messageText: msg);
      },
    ),
  ],
),

场景一：反向：真 当我使用reverse: true 时，新消息会被推送到列表视图的顶部，这会导致视图跳转一个消息高度。（当然）没有漂亮的动画，因为列表只是被重新渲染。此外，如果用户向上滚动以阅读较旧的消息并且有新消息到达，则视图会按该特定消息的高度跳跃。这样做的好处是，当用户打开键盘时，列表视图会被键盘的高度向上推。视图/滚动位置不会改变。

场景 2：反向：假 在这种情况下，列表顶部实际上是列表视图的顶部。这意味着新消息到达列表的底部，我必须执行“滚动到 maxExtent”操作，这会产生很好的副作用，即新消息的动画效果很好。另外，如果用户滚动到旧消息，则视图不会在新消息到达时跳转。关于这种情况的唯一重大负面影响是，当用户打开键盘时，它不会向上推列表。所以实际上它确实将列表视图的底部向上推，但它不会向上推当前查看的消息。当用户向上滚动到较旧的消息时，也会发生相同的行为。当他点击输入栏并打开键盘时，它会覆盖用户刚刚查看的消息。

我想要什么：

聊天消息的列表视图，当新消息到达时会很好地动画化
列表视图不应跳转到新消息
键盘不应覆盖最近的消息

我希望能很好地描述我的问题，让你理解，我希望有人可以帮助我，或者至少给我一个建议。

【问题讨论】：

标签： flutter google-cloud-firestore

【解决方案1】：

尝试删除Flexible 并用SingleChildScrollView 包裹Column，

如果需要，将物理属性添加到 NeverScroll 到 ListView

希望这会奏效！

【讨论】：

不幸的是它没有解决我的问题