Flutter ListView 聊天场景多行文消息下无法滚动到底部如何解决？

触发滚动的时机过早，addPostFrameCallback仅在第一帧渲染完成时回调，此时多行文本的实际高度还未完成最终布局计算，_scrollController.position.maxScrollExtent拿到的是基于单行文本预估高度计算的错误值，因此消息行数越多，滚动偏差越大。
点击屏幕时会触发页面布局重算，此时所有文本控件高度已计算完成，maxScrollExtent更新为正确值，因此列表会自动滚动到真正的底部。

• 方案1（最优解，推荐）：给聊天列表的ListView设置reverse: true属性，同时将消息数组倒序渲染（最新消息放在数组第0位）。开启reverse后列表初始滚动位置默认就是最底部，不需要手动调用滚动逻辑，从根源上避免布局计算延迟导致的滚动偏差问题。
• 方案2：使用Scrollable.ensureVisible直接锚定最后一条消息。给最后一条消息的Widget绑定GlobalKey，布局完成后直接根据控件位置计算滚动距离：

  // 最后一条消息的key定义
  final GlobalKey _lastMessageKey = GlobalKey();
  
  // 布局完成回调
  WidgetsBinding.instance?.addPostFrameCallback((_) {
    if (_lastMessageKey.currentContext != null) {
      Scrollable.ensureVisible(
        _lastMessageKey.currentContext!,
        duration: const Duration(milliseconds: 200),
        curve: Curves.easeInOut,
        alignment: 1.0,
      );
    }
  });
  

• 方案3：增加滚动位置校验，直到滚动到正确位置。修改原有滚动逻辑，循环校验滚动位置直到稳定：

  WidgetsBinding.instance?.addPostFrameCallback((_) async {
    while (_scrollController.hasClients && _scrollController.position.pixels != _scrollController.position.maxScrollExtent) {
      await _scrollController.animateTo(
        _scrollController.position.maxScrollExtent,
        duration: const Duration(milliseconds: 200),
        curve: Curves.easeInOut,
      );
      await Future.delayed(const Duration(milliseconds: 50));
    }
  });
  

内容的提问来源于stack exchange，提问作者busuu