如何解决具有动态宽度的Flutter水平gridview
我尝试使用Flutter_staggered_grid_view,但似乎它的垂直滚动效果更好。
我的目标是具有动态宽度的水平网格视图,以使网格感觉自然且不会分散开
这就是我所拥有的(我删除了一些UI代码,但是本质上相同)
GridView.builder(
scrollDirection: Axis.horizontal,itemCount: sourceList.length,gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2,childAspectRatio: .3),itemBuilder: (context,i) {
final e = sourceList[i];
return Text(
e.name,);
},);
这就是我想要的
解决方法
这是我通过使用三元运算符来调整mainAxisCellCount
可以达到的最大值。您可以根据最短和最长字符串的长度来调整计数。
Container(
height: 180.0,child: StaggeredGridView.countBuilder(
crossAxisCount: 4,itemCount: 8,scrollDirection: Axis.horizontal,itemBuilder: (BuildContext context,int index) => Container(
child: Center(child: Container(
padding: EdgeInsets.symmetric(vertical: 10.0,horizontal: 15.0),child: Chip(
label: Text('${fruits[index]}',overflow: TextOverflow.visible,maxLines: 1,style: TextStyle(),)))),),staggeredTileBuilder: (int index) => StaggeredTile.count(2,fruits[index].length > 3 ? fruits[index].length > 8 ? fruits[index].length > 2 ? 4 : 3 : 2 : 1),mainAxisSpacing: 0.0,crossAxisSpacing: 0.0,
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。