Flutter PageView使用案例

前言

现在的小目标是要实现一个 「图片轮播」的效果，我们在 Android 中可以使用ViewPager结合handler或者 Timer去实现。

而我们在 Flutter中，其实也是类似的。
那么，在Flutter中，代替 Android 中的ViewPager组件是PageView，而且，这个PageView相比ViewPager扩展性更高。

我们来看一下

Flutter PageView 官网

根据官网的介绍，PageView 在需要展示的页面很多时，有「控件复用」功能，而且，我们还可以通过

    this.scrollDirection = Axis.horizontal  | Axis.vertical

来设置滚动的方向，也就是说，我们还可以完成「纵向滚动」，真的很棒有么有？

那我们来使用一下pageview

一、准备数据

 

偷的小米官网的轮播图

二、准备一个PageController

三、准备一个很普通的PageView ，仔细看看哦

四、交给身体

 

看一下效果图

 

用到了FadeInImage.assetNetwork这个可以提供占位图的Image,使用也很简单，大家可以用一下

onPageChanged 通过这个属性，我们能够监听当前滑动到的页码，从而做出相应的处理

如果想对当中的一页进行点击，那么给 itemBuilder: 返回的控件包裹上

GestureDetector，或者直接返回一个button类型的Widget即可

ok,了解了这个PageView，接下来，我们想法子搞一个「轮播效果」，请见下一篇文章。