Flutter 踩坑记录: Expanded 会尽可能占据剩余空间,导致在滑动时超出 ListView 范围的部分也被渲染

旧版代码的奇怪问题当 listView 滑动的时候,滑出 listView的范围之后,按钮的 文本Perman 会立即消失,而背景色的图片 image: AssetImage("assets/pinkBtn.png")却没有消失,
而是再往上滑动到SizedBox(height: 10,),的区域结束之后才消失
这个现象可能是因为在 Column 内部,ListView.builder 是在一个 Expanded 中,而 Expanded 会尽可能占据剩余空间,导致在滑动时超出 ListView 范围的部分也被渲染。
为了解决这个问题,可以将 Column 包裹在一个 SingleChildScrollView 中,这样在滑动时超出 ListView 范围的部分将会被隐藏,而不会显示出来
通过将 Column 包裹在 SingleChildScrollView 中,并设置 ListView.builder 的 physics 属性为 NeverScrollableScrollPhysics(),可以禁用 ListView 的滑动,
然后通过 shrinkWrap 属性将 ListView 的高度适应内容,这样超出范围的部分将会被隐藏,不再显示。


  Column(
  children: [
    SizedBox(height: 10,),
    Expanded(
      child: Container(
        margin: EdgeInsets.symmetric(horizontal: 12),
        child: ListView.builder(
          itemCount: 10,
          itemBuilder: (context, index) {
            return Container(
              height: 160,
              decoration: BoxDecoration(
        
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值