Flutter之 GridView

简介: Flutter之 GridView

Flutter之 GridView

最终效果

image.png

image.png

image.png

image.png

动态加载

image.png

cacheExtent:同 ListView,预加载的区域。


controller:同 ListView,滑动监听,值为一个 ScrollController 对象,这个属性应该可以用来做下拉刷新和上垃加载,后面详细研究。


padding:同 ListView,整个 GridView 的内间距。


physics:同 ListView,设置 GridView 如何响应用户的滑动行为,值为一个 ScrollPhysics 对象,它的实现类常用的有:

AlwaysScrollableScrollPhysics:总是可以滑动。

NeverScrollableScrollPhysics:禁止滚动。

BouncingScrollPhysics:内容超过一屏,上拉有回弹效果。

ClampingScrollPhysics:包裹内容,不会有回弹,感觉跟 AlwaysScrollableScrollPhysics 差不多。


reverse:Item 的顺序是否反转,若为 true 则反转,这个翻转只是行翻转,即第一行变成最后一行,但是每一行中的子组件还是从左往右摆放的,用到该属性的开发情景较少。


scrollDirection:GirdView 的方向,为 Axis.vertical 表示纵向,为 Axis.horizontal 表示横向,横向的话 CrossAxis 和 MainAxis 表示的轴也会调换,为 Axis.Horizontal 的情况也较少。


semanticChildCount:不太清楚。


shrinkWrap:不太清楚。


children:子组件,不用多说。


目录
相关文章
|
3月前
Flutter 列表学习(listview,gridview,ExpansionTile,ScrollController,RefreshIndicator)
Flutter 列表学习(listview,gridview,ExpansionTile,ScrollController,RefreshIndicator)
|
5月前
|
索引
Flutter.源码分析.flutter/packages/flutter/lib/src/widgets/scroll_view.dart/GridView
Flutter.源码分析.flutter/packages/flutter/lib/src/widgets/scroll_view.dart/GridView
50 0
|
Web App开发 测试技术 索引
Flutter Web网站之ScrollView+GridView优化
Flutter Web网站之ScrollView+GridView优化
198 0
Flutter Web网站之ScrollView+GridView优化
【布局 widget】 Flutter GridView
GridView 独有的参数其实只有一个 gridDelegate,gridDelegate 的作用是为 GridView 布局,制定每行几个 child,空白多少等。
149 0
【布局 widget】 Flutter GridView
flutter系列之:flutter中常用的GridView layout详解
GridView是一个网格化的布局,如果在填充的过程中子组件超出了展示的范围的时候,那么GridView会自动滚动。 因为这个滚动的特性,所以GridView是一个非常好用的Widget。今天我们一起来探索一下GridView这个layout组件的秘密。
flutter系列之:flutter中常用的GridView layout详解
|
前端开发 Java 开发工具
Flutter(七)——多子元素组件:GridView,CustomScrollView,Flex,Wrap
Flutter(七)——多子元素组件:GridView,CustomScrollView,Flex,Wrap
314 0
Flutter(七)——多子元素组件:GridView,CustomScrollView,Flex,Wrap
【Flutter】GridView 网格布局 ( GridView.count 构造函数 | crossAxisCount 参数指定每行元素个数 )
【Flutter】GridView 网格布局 ( GridView.count 构造函数 | crossAxisCount 参数指定每行元素个数 )
504 0
【Flutter】GridView 网格布局 ( GridView.count 构造函数 | crossAxisCount 参数指定每行元素个数 )
|
Android开发 容器
Flutter入门:组件Card、SafeArea、PageView、GridView
Card Card对应Material Design中的CardView,使用很简单 Card的两个特点就是阴影和圆角。
570 0
|
前端开发 容器
flutter GridView 九宫格
* GridView的构造函数方法,一次性构建所有的子条目,适用于少量数据 * GridView.builder方式来构建,懒加载模式,适用于大量数据的情况 * GridView.count方式来构建,适用于固定列的情况,适用于少量数据 GridView.extent 方式来构建,适用于条目有最大宽度的限制的情况,适用于少量数据的情况下 * GridView.custom 方式来构建,可配置子条目的排列规则也可配置子条目的渲染加载模式
flutter GridView 九宫格
|
16天前
|
Android开发 iOS开发 容器
鸿蒙harmonyos next flutter混合开发之开发FFI plugin
鸿蒙harmonyos next flutter混合开发之开发FFI plugin