微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在颤动中制作具有不同图像高度的交错网格视图?

如何解决如何在颤动中制作具有不同图像高度的交错网格视图?

我想要一个带有 Card 小部件的交错网格视图,我希望卡片的高度取决于正在加载的图像的高度。

由于我的构建方法太长,这里是我的卡片视图的代码

https://gist.github.com/brendoncheung/2026a64410eddde20fa8ec740bbb9d84

第 7 行的 SizedBox 是我认为使卡片具有恒定高度的原因,但如果我移除 SizedBox,它会崩溃。

如果我删除 SizedBox,我会得到这个错误

RenderFlex 子级具有非零 flex 但传入高度约束 无界。

我已确保所有 ColumnRow 小部件的父级都没有未绑定的约束。

这是我的 StaggeredGridView 代码

  @override
  Widget build(BuildContext context) {
    return StaggeredGridView.countBuilder(
      crossAxisCount: 2,itemCount: items.length,itemBuilder: (context,index) => ItemWidget(
          item: items[index],onTap: (item) => Navigator.of(context).push(MaterialPageRoute(
              builder: (context) => DetailItemScreen(
                    item: item,)))),staggeredTileBuilder: (index) => StaggeredTile.fit(1),);
  }

下面这两张图是卡片小部件,另一张是调试油漆,

enter image description here

enter image description here

解决方法

将我的 StaggeredGridView 设置与您的唯一不同之处进行比较,我的这两个设置有助于解决视口问题。

physics: NeverScrollableScrollPhysics(),shrinkWrap: true,

但我同意大小的盒子可能使高度相同。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。