百莲凯祛斑怎么样,pep小学英语四年级上册教案,湖北吧
基于sliver的延迟构建模式:
通常可滚动组件的子组件可能会非常多,占用的总高度也会非常大,如果要一次性将子组件全部构建出将会导致性能差的问题出现,为此,flutter中提出一个sliver(中文为"薄片"的意思)概念,如果一个可滚动组件支持sliver模型,那么该滚动组件可以将子组件分成好多个薄片(sliver),只有当sliver出现在视口时才会去构建它,这种模型也成为"基于sliver的延迟构建模型"。可滚动组件中有很多都支持基于sliver的延迟构建模型,如listview、gridview,但是也有不支持该模型的,如singlechildscrollview
import 'package:flutter/material.dart'; void main() => runapp(demoapp()); class demoapp extends statelesswidget { @override widget build(buildcontext context) { return new materialapp( title: 'singlechildscrollview demo', home: new scaffold( appbar: appbar( title: new text('singlechildscrollview demo'), ), body: new center( child: new column( children: <widget>[ container( width: 300.0, height: 200.0, color: colors.blue, ), container( width: 300.0, height: 200.0, color: colors.yellow, ), container( width: 300.0, height: 200.0, color: colors.pink, ), container( width: 300.0, height: 200.0, color: colors.blue, ), container( width: 300.0, height: 200.0, color: colors.yellow, ), container( width: 300.0, height: 200.0, color: colors.pink, ), container( width: 300.0, height: 200.0, color: colors.blue, ), ], ), ), ), ); } }
在flutter实现页面滑动需要用到singlechildscrollview组件,singlechildscrollview和android中scrollview类似,都是只能接收一个子组件,先看一下singlechildscrollview的源码:
const singlechildscrollview({ key key, //滚动方向,默认是垂直方向 this.scrolldirection = axis.vertical, //是否按照阅读方向相反的方向滑动 this.reverse = false, //内容边距 this.padding, //是否使用widget树中默认的primaryscrollcontroller bool primary, //此属性接受一个scrollphysics类型的对象,它决定可以滚动如何响应用户操作,比如用户滑动完抬起手指后,继续执行动画,或者滑动到边界时,如何显示。 //默认情况下,flutter会根据具体平台分别使用不同的scrollphysics对象,对应不同的显示效果,如当滑动到边界时,继续拖动的话,在ios上会出现弹性效果, //而在android上会出现微光效果。如果你想在所有平台下使用同一种效果,可以显示指定一个固定的scrollphysics。 //flutter sdk包含两个scrollphysics的子类。1.clampingscrollphysics:android下微光效果,2.bouncingscrollphysics:ios下弹性效果 this.physics, //此属性接收一个scrollcontroller对象,scrollcontroller的主要作用是控制滚动位置和监听滚动事件。 //默认情况下,widget树中会有一个默认的primaryscrollcontroller,如果子树中的可滚动组件没有显示的指定controller,并且primary属性值为true时,可滚动组件会使用这个默认的scrollcontroller。 //这种机制带来的好处是父组件可以控制子树中可滚动的滚动行为,例:scaffold正是使用这种机制在ios中实现了点击导航回到顶部的功能。 this.controller, this.child, })
demo示例:
import 'package:flutter/material.dart'; void main() => runapp(demoapp()); class demoapp extends statelesswidget { @override widget build(buildcontext context) { return new materialapp( title: 'singlechildscrollview demo', home: new scaffold( appbar: appbar( title: new text('singlechildscrollview demo'), ), body: new singlechildscrollview( physics: bouncingscrollphysics(), child: new center( child: new column( children: <widget>[ container( width: 300.0, height: 200.0, color: colors.blue, ), container( width: 300.0, height: 200.0, color: colors.yellow, ), container( width: 300.0, height: 200.0, color: colors.pink, ), container( width: 300.0, height: 200.0, color: colors.blue, ), container( width: 300.0, height: 200.0, color: colors.yellow, ), container( width: 300.0, height: 200.0, color: colors.pink, ), container( width: 300.0, height: 200.0, color: colors.blue, ), ], ), ), ), ), ); } }
效果截图:
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
Android studio开发小型对话机器人app(实例代码)
Android通过Java sdk的方式接入OpenCv的方法
Android 通过cmake的方式接入opencv的方法步骤
Android Studio finish()方法的使用与解决app点击“返回”(直接退出)
Android 进度条 ProgressBar的实现代码(隐藏、出现、加载进度)
网友评论