Flutter 聊天界面使用ListView的reverse:true，导致条目太少的时候会从下往上显示，导致顶部大片空白

天意__2025-11-18 13:16

原文：这个问题主要是因为布局的原因，正常情况下时候ListView的reverse:true，就算条目太少也是从上往下显示的。出现这个原因主要是因为，聊天窗口大家都是使用Column嵌套ListView，ListView负责消息列表，然后还要有输入框之类的，所以不能让ListView占满怎么屏幕所以需要使用Expanded包裹ListView，他会把ListView在条目过少的时候照样将他的宽度拉到可适应的最大，这个是导致布局异常的原因。想要解决就是让Expanded不要拉伸ListView，在ListView的外成嵌套一个布局，让Expanded拉伸该布局，然后让该布局设置布局内子widget的定位规则丛上往下，这样就可以了

原文链接：https://blog.csdn.net/qq_35364808/article/details/111618498

Dart 复制代码

Expanded(
        child: Align( // 此处为关键代码
      alignment: Alignment.topCenter,
      child: ListView.builder(
          reverse: true,
          shrinkWrap: true,
          itemCount: widget.model.dataList.length,
          itemBuilder: (context, index) {
            return ChatMessageWidget();
          }),
    ))