Dart/Flutter中ListView滚动失效 数据显示不全如何解决

你遇到的滚动异常、内容被截断问题核心是多层垂直方向滚动组件嵌套冲突，以及存在不必要的滚动容器嵌套、固定高度限制：你的代码共嵌套了4层垂直方向的滚动组件，同方向滚动事件互相抢占，加上Card内写死了100的固定高度，最终导致内容无法正常滚动展示。

具体修改步骤 #

• 移除最外层无用的ListView包裹：当前body下的ListView仅包含1个ListView.builder子节点，无存在意义，直接删除即可，将内部的ListView.builder作为body的直接子组件
• 禁止内层无需独立滚动的滚动组件的滚动能力：给所有内层不需要单独滚动的ListView、ListView.builder添加physics: NeverScrollableScrollPhysics()属性，让滚动事件全部交给最外层的滚动组件处理，避免滚动冲突
• 替换不必要的滚动容器：Card内部的ListView可以直接替换为Column组件，无需使用滚动容器承载固定的两个子节点，减少嵌套层级同时提升渲染性能
• 调整固定高度限制：你当前给Card内的SizedBox设置了固定height:100，如果内部内容总高度超过100会被截断，可根据业务需求删除固定高度让内容自适应，或者调整为合适的高度值

修改后参考代码 #

body: ListView.builder(
  scrollDirection: Axis.vertical,
  shrinkWrap: true,
  itemCount: _mOfferListRemoveDuplicate == null ? 0 : _mOfferListRemoveDuplicate.length,
  itemBuilder: (BuildContext context, index) {
    return Card(
      margin: EdgeInsets.all(5.0),
      elevation: 1,
      // 若不需要固定高度可删除SizedBox包裹，直接用Column作为Card的child
      child: SizedBox(
        height: 100,
        // 替换原ListView为Column
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                _mOfferListRemoveDuplicate[index],
                textAlign: TextAlign.left,
                style: TextStyle(fontSize: 4.0, color: Colors.green,),
              ),
            ),
            Expanded(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: ListView.builder(
                  scrollDirection: Axis.vertical,
                  shrinkWrap: true,
                  // 禁止内层列表独立滚动，将滚动事件交给外层处理
                  physics: NeverScrollableScrollPhysics(),
                  itemCount: _mOfferList == null ? 0 : _mOfferList.length,
                  itemBuilder: (BuildContext context, innerIndex) {
                    return Text(
                      _mOfferList[innerIndex].offerTitle,
                      style: TextStyle(fontSize: 5.0),
                    );
                  }
                ),
              ),
            ),
          ],
        ),
      )
    );
  }
)

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