【Flutter学习】可滚动组件之SingleChildScrollView

一，概述　　

　　SingleChildScrollView类似于Android中的ScrollView，它只能接收一个子Widget。定义如下：

二，构造函数

 const SingleChildScrollView({

  Key key,

  this.scrollDirection = Axis.vertical,

  this.reverse = false,

  this.padding,

  bool primary,

  this.physics,

  this.controller,

  this.child,

  this.dragStartBehavior = DragStartBehavior.down,

  }) : assert(scrollDirection != null),

  assert(dragStartBehavior != null),

  assert(!(controller != null && primary == true),

       'Primary ScrollViews obtain their ScrollController via inheritance from a PrimaryScrollController widget. '

       'You cannot both set primary to true and pass an explicit controller.'

),

       primary = primary ?? controller == null && identical(scrollDirection, Axis.vertical),

       super(key: key);

三，参数解析

key：当前元素的唯一标识符(类似于 Android 中的 id)
scrollDirection：滚动方向，默认是垂直
reverse：是否按照阅读方向相反的方向滑动。
padding：填充距离
primary：是否使用 widget 树中默认的 PrimaryScrollController 。当滑动方向为垂直方向（scrollDirection值为Axis.vertical）并且controller没有指定时，primary默认为true
physics：此属性接受一个ScrollPhysics对象，它决定可滚动Widget如何响应用户操作，比如用户滑动完抬起手指后，继续执行动画；或者滑动到边界时，如何显示。默认情况下，Flutter会根据具体平台分别使用不同的ScrollPhysics对象，应用不同的显示效果，如当滑动到边界时，继续拖动的话，在iOS上会出现弹性效果，而在Android上会出现微光效果。如果你想在所有平台下使用同一种效果，可以显式指定，Flutter SDK中包含了两个ScrollPhysics的子类可以直接使用： ClampingScrollPhysics→Android下微光效果 / BouncingScrollPhysics→iOS下弹性效果
controller：此属性接受一个ScrollController对象。ScrollController的主要作用是控制滚动位置和监听滚动事件
child：子元素

四，示例demo　　

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      title: 'Flutter Demo',

      theme: ThemeData(

        primarySwatch: Colors.blue,

      ),

      home: new SingleChildScrollViewWidget(),

    );

  }

}

class SingleChildScrollViewWidget extends StatefulWidget {

  @override

  State<StatefulWidget> createState() {

    return new _StackState();

  }

}

class _StackState extends State<SingleChildScrollViewWidget> {

  String numberStr = "12345678909876543210123456789";

  @override

  Widget build(BuildContext context) {

    // TODO: implement build

    return new MaterialApp(

      home:  new Scaffold(

        //AppBar

        appBar: new AppBar(

          title: new Text('ScroollWidget'),

        ),

        //Body

        body: new Scrollbar(

          child: new SingleChildScrollView(

            scrollDirection: Axis.horizontal,

            child: new Center(

              child: new Row(

                children:numberStr.split("").map((c) => Text(c, textScaleFactor: 2.0,)).toList(),

              ),

            ),

          ),

        ),

      ),

    );

  }

}

巴特西

【Flutter学习】可滚动组件之SingleChildScrollView

一，概述

二，构造函数

三，参数解析

四，示例demo

最新文章

热门文章