Flutter中用ListView嵌套GridView报错异常

时间:2021-08-14 01:14:55

flutter中的ListView组件和GridView组件都是常用的布局组件,有时候ListView中需要嵌套GridView来使用,例如下图:

Flutter中用ListView嵌套GridView报错异常

这种情况就需要在ListView里面再嵌套一个GridView用于排放图片等信息,先来看一下GridView一些常用的参数

GridView.count(
crossAxisCount: 3, // 每行显示多少个
crossAxisSpacing: 1.5, // 横轴网格间距
mainAxisSpacing: 1.5, // 纵轴网格间距
childAspectRatio: 11/16, // 网格比例
)

在GridView中的元素无法设置其宽高,主要通过childAspectRatio来设置其比例,通过比例来显示其大小。

在项目中如果直接使用ListView嵌套GridView进行布局,其会出现报错异常,例如下面异常:

I/flutter ( 5969): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 5969): The following assertion was thrown during performResize():
I/flutter ( 5969): Vertical viewport was given unbounded height.
I/flutter ( 5969): Viewports expand in the scrolling direction to fill their container.In this case, a vertical
I/flutter ( 5969): viewport was given an unlimited amount of vertical space in which to expand. This situation
I/flutter ( 5969): typically happens when a scrollable widget is nested inside another scrollable widget.
I/flutter ( 5969): If this widget is always nested in a scrollable widget there is no need to use a viewport because
I/flutter ( 5969): there will always be enough vertical space for the children. In this case, consider using a Column
I/flutter ( 5969): instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size
I/flutter ( 5969): the height of the viewport to the sum of the heights of its children.

  

出现这种情况可在GridView中设置shrinkWrap:true即可解决:

GridView.count(
shrinkWrap:true, // 处理listview嵌套报错
),

  

此时有可能出现手指在GridView区域滑动时ListView无法进行滚动,处理该问题可在GridView中设置physics: NeverScrollableScrollPhysics()来处理:

GridView.count(
physics: NeverScrollableScrollPhysics(), // 处理GridView中滑动父级Listview无法滑动
)

  

Flutter中用ListView嵌套GridView报错异常的更多相关文章

  1. 【Android】listview 嵌套gridview报错,代码:”during second layout pass: posting in next frame

    作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985, QQ986945193 公众号:程序员小冰 说明:本人曾经在listview嵌套gridview出现 ...

  2. android listView嵌套gridview的使用心得

    在开发的过程中可能需要用到listview嵌套gridview的场景,但是在Android中, 不能在一个拥有Scrollbar的组件中嵌入另一个拥有Scrollbar的组件,因为这不科学,会混淆滑动 ...

  3. ScrollView嵌套ListView嵌套GridView的上下拉以及加载更多

    ScrollView 效果 ScrollView 说明 一个ScrollView 嵌套ListView 嵌套GridView的上拉加载更多,下拉刷新的demo. 主要是重写了GridView和Lsit ...

  4. ListView嵌套GridView

    首先,我们通过两个实例来了解下本篇文章所讲的重点,看下图: 微博: 陌陌: 大家应该对这两款软件并不陌生,接下来,我将列举下本文将要实现的几个点: 1.ListView嵌套GridView,互不冲突, ...

  5. ListView嵌套GridView,显示不全解决办法

    ListView嵌套GridView时,遇到了GridView只显示一行,其余都显示不出来的问题,最终解决办法如下: 需要自定义GridView,重新绘制高度即可: public class MyGr ...

  6. ListView嵌套GridView使用详解及注意事项

    ListView嵌套GridView即ListView的每个Item中都包含一个GridView:需要注意的是由于ListView和GridView都是可滑动的控件. 所以需要自定义GridView, ...

  7. Struts2报错异常Method "setUser" failed for object com.mikey.action.ConverterAction@dd34285

    在写类型转换的时候发现报错 异常信息 ognl.MethodFailedException: Method "setUser" failed for object com.mike ...

  8. Android中ListView嵌套GridView的简单消息流UI(解决宽高问题)

    最近搞一个项目,需要用到类似于新浪微博的消息流,即每一项有文字.有九宫格图片,因此这就涉及到ListView或者ScrollView嵌套GridView的问题.其中GridView的高度问题在网上都很 ...

  9. 解决flutter的image_cropper组件引入报错问题

    在使用flutter的图片裁剪组件image_cropper,github:https://github.com/hnvn/flutter_image_cropper 根据它的要求,安卓需要在文件[A ...

随机推荐

  1. html中meta的设置

    meta设置 <meta name="viewport" content="width=device-width, initial-scale=1.0, user- ...

  2. union和union all有什么不同&quest;

    union和union all有什么不同? 相同点:用来获取两个或者两个以上结果集的并集 不同点: union会自动去重,排序 union all没有去重,排序

  3. &lbrack;转&rsqb;ArcGIS计算图斑的四邻坐标&lpar;XMin&comma;XMax&comma;YMin&comma;YMax&rpar;

    1.背景: 在国土,调查等行业业务里面经常有需要计算某个图斑的四邻坐标,即xmax,xmin,ymin,ymax;也就是常说的MBR(最小外包矩形),本教程演示如何计算一个shapefile文件上的图 ...

  4. FFT —— 快速傅里叶变换

    问题: 已知A[], B[], 求C[],使: 定义C是A,B的卷积,例如多项式乘法等. 朴素做法是按照定义枚举i和j,但这样时间复杂度是O(n2). 能不能使时间复杂度降下来呢? 点值表示法: 我们 ...

  5. At-rule &vert; CSS &commat; 规则

    译自:MDN(Mozilla开发者网络) At-rule 一.什么是at-rules eg:@charset "utf-8"; at-rule 是CSS样式声明,以@开头,紧跟着是 ...

  6. paip&period;c&plus;&plus; qt messagebox用法

    paip.c++ qt messagebox用法 作者Attilax ,  EMAIL:1466519819@qq.com  来源:attilax的专栏 地址:http://blog.csdn.net ...

  7. DLoopDetector回环检测算法

    词袋模型是一种文本表征方法,它应用到计算机视觉领域就称之为BoF(bag of features),通过BoF可以把一张图片表示成一个向量.DBoW2是一个视觉词袋库,它提供了生成和使用词典的接口,但 ...

  8. 人手一份核武器 - Hacking Team 泄露(开源)资料导览手册

    https://zhuanlan.zhihu.com/p/20102713 author:蒸米 0x00 序 事先声明本人并不是全栈安全工程师,仅仅是移动安全小菜一枚,所以对泄漏资料的分析难免会有疏忽 ...

  9. 《构建之法》chapter5&comma;6 读书心得

    <构建之法>第五章用体育运动等团队例子引出软件开发团队的形式,用更加生活化.形象化的例子让读者更能理解软件开发团队的形式.软件团队形式多样,适用于不同的人员与需求.团队可能会演变的模式有: ...

  10. Android UiAutomator 快速调试

    背景:在Eclipse中不能直接运行Uiautomator工程,所以每次编写一份用例都要进行手动输入命令,很烦.调试起来不仅繁琐还浪费时间.网上找到一份快速调试的代码UiAutomatorHelper ...