文章目录
下面我们来介绍下Flutter中的滑动控件
SingleChildScrollView
、列表
ListView
和表格
GridView
。
1. SingleChildScrollView
SingleChildScrollView
类似于Android中的ScrollView
,我使用的较浅,在我目前看来,他和ScrollView
的唯一区别就是它还可以横向滚动。
我们先来看下他的定义:
SingleChildScrollView({
this.scrollDirection = Axis.vertical, //滚动方向,默认是垂直方向
this.reverse = false,
this.padding,
bool primary,
this.physics,
this.controller,
this.child,
})
scrollDirection
:设定滚动的方向,可以设定Axis.vertical
或者Axis.horizon
;reverse
:是否按照阅读方向的反方向滑动,emmm这个可能有点觉得莫名其妙,但是如阿拉伯语言地区,他们阅读和我国古时候一样是从右向左的,所以如果reverse
为true
,且滚动方向是水平滚动的话,如果系统时阿拉伯语等从右向左阅读的语言时,方向是从右向左的;padding
:留白的大小,和Padding
的用法一样,通过EdgeInsets
来设定,具体可以看前几章将Flutter基础Widget;primary
:指是否使用widget树中默认的PrimaryScrollController
;当滑动方向为垂直方向(scrollDirection
值为Axis.vertical
)并且没有指定controller
时,primary
默认为true
;physics
:用于控制滚动方式,这个等会重点讲解;controller
:用于滚动监听及控制;child
:子Widget。
1.2 physics
这个参数是用于控制滚动方式,有几种参数:
NeverScrollablePhysics
:呈现不可滚动状态;BouncingScrollPhysics
:当列表滑动结束时,会回弹列表,类似于iOS的列表滑动效果;
ClampingScrollPhysics
:滑动结束时会显示水波纹阴影,类似于Android的列表滑动效果;
FixedExtentScrollPhysics
:可以自己制作滑动效果,但是我也不会,所以在此不做解释?。
2. ListView
ListView
可以沿一个方向上线性排布所有子组件(不仅局限于竖直方向)。
让我们来看下他的定义:
ListView({
...
//可滚动widget公共参数
Axis scrollDirection = Axis.vertical,
bool reverse = false,
ScrollController controller<