Flutter PageView使用案例
前言现在的小目标是要实现一个 「图片轮播」的效果,我们在 Android 中可以使用ViewPager结合handler或者Timer去实现。而我们在Flutter中,其实也是类似的。那么,在Flutter中,代替 Android 中的ViewPager组件是PageView,而且,这个PageView相比ViewPager扩展性更高。我们来看一下Flutter Pag...
·
前言
现在的小目标是要实现一个 「图片轮播」的效果,我们在 Android 中可以使用
ViewPager结合handler或者Timer去实现。而我们在
Flutter中,其实也是类似的。
那么,在Flutter中,代替 Android 中的ViewPager组件是PageView,而且,这个PageView相比ViewPager扩展性更高。我们来看一下
根据官网的介绍,
PageView在需要展示的页面很多时,有「控件复用」功能,而且,我们还可以通过this.scrollDirection = Axis.horizontal | Axis.vertical来设置滚动的方向,也就是说,我们还可以完成「纵向滚动」,真的很棒有么有?
那我们来使用一下
pageview一、准备数据
偷的小米官网的轮播图
二、准备一个
PageController
三、准备一个很普通的
PageView,仔细看看哦
四、交给身体
看一下效果图
用到了
FadeInImage.assetNetwork这个可以提供占位图的Image,使用也很简单,大家可以用一下
onPageChanged通过这个属性,我们能够监听当前滑动到的页码,从而做出相应的处理如果想对当中的一页进行点击,那么给
itemBuilder:返回的控件包裹上
GestureDetector,或者直接返回一个button类型的Widget即可ok,了解了这个PageView,接下来,我们想法子搞一个「轮播效果」,请见下一篇文章。
更多推荐









所有评论(0)