Flutter ScrollView 滑动组件

SingleChildScrollView


【x1】微信公众号的每日提醒 随时随记 每日积累 随心而过

【x2】各种系列的视频教程 免费开源 关注 你不会迷路

【x3】系列文章 百万 Demo 随时 复制粘贴 使用


ScrollView 是一个抽象类 不可以直接实例化

SingleChildScrollView类似于开发中常用的ScrollView

SingleChildScrollView

竖直滑动

 
  Widget buildScrollView() {

    return  SingleChildScrollView(
        //滑动的方向 Axis.vertical为垂直方向滑动,Axis.horizontal 为水平方向
        scrollDirection: Axis.vertical,
        //true 滑动到底部
        reverse: false,
        padding: EdgeInsets.all(0.0),
        滑动到底部回弹效果
        physics: BouncingScrollPhysics(),
        child: Center(
          child: Column(
            children: <Widget>[
              Container(color: Colors.white ,margin: EdgeInsets.only(top: 10),height: 440,),
              Container(color: Colors.green ,margin: EdgeInsets.only(top: 10),height: 540,),
            ],
          ),
        ),
    );
  }

水平方向滑动


  Widget buildScrollview() {

    return  SingleChildScrollView(
        //滑动的方向 Axis.vertical为垂直方向滑动,Axis.horizontal 为水平方向
        scrollDirection: Axis.horizontal,
        //true 滑动到底部
        reverse: false,
        padding: EdgeInsets.all(0.0),
        //滑动到底部回弹效果
        physics: BouncingScrollPhysics(),
        child: Center(
          child: Row(
            children: <Widget>[
              Container(color: Colors.white ,margin: EdgeInsets.only(top: 10),width: 440,height: 200,),
              Container(color: Colors.green ,margin: EdgeInsets.only(top: 10),width: 540,height: 200,),
            ],
          ),
        ),
    );
  }

【1】 目前在西瓜视频上免费刊登 Flutter 系列教程,每日更新,欢迎关注接收提醒点击查看提示

在这里插入图片描述


【2】 本公众号会首发系列专题文章,付费的视频课程会在公众号中免费刊登,在你上下班的路上或者是睡觉前的一刻,本公众号都是你浏览知识干货的一个小选择,收藏不如行动,在那一刻,公众号会提示你该学习了。
在这里插入图片描述

早起的年轻人 CSDN认证博客专家 移动开发 项目管理 Java
只要用心去做,每一件事情还是有可能成功的,当然成功是没有界限的,只不过是达到自己心里的那个目标,公众号:我的大前端生涯,一个爱喝茶的程序员,通常会搞搞SpringBoot 、Herbinate、Mybatiys、Android、iOS、Flutter、Vue、小程序等.
©️2020 CSDN 皮肤主题: 代码科技 设计师:Amelia_0503 返回首页