Flutter 学习之旅(十八) 可滚动控件 Single

SingleChildScrollView 类似android 中的ScrollView ,只能有一个子控件,
他所有的属性在 介绍ScrollView的时候都说明过

({
    Key key,
    ///方向
    this.scrollDirection = Axis.vertical,
    ///是否反向
    this.reverse = false,
    ///内边距
    this.padding,
    ///当方式是Axis.vertical 并且controller 为null时默认没true,为true则使用PrimaryScrollController
    bool primary,
    ///结束拖动时效果响应
    this.physics,
    ///控制器
    this.controller,
    this.child,
    ///响应拖动的时机
    this.dragStartBehavior = DragStartBehavior.start,
  })

值得一说的是SingleChildScrollView 最好使用在和屏幕差距不大的布局中,因为他只有一个child 所以不会有基于Sliver延迟加载的功能,如果太大了的话使用SingleChildScrollView的性能非常不好,

class TsmSingleChildScrollViewPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
    return Scaffold(
      appBar: AppBar(
        title: Text('SingleChildScrollView'),
        centerTitle: true,
      ),
      body: Scrollbar(
        ///添加进度条
        child: SingleChildScrollView(
          padding: const EdgeInsets.all(15),
          child: Column(
              children: str
                  .split("")
                  .map((e) => Container(
                        color: Colors.redAccent,
                        child: Center(
                          child: Text(
                            e,
                            textScaleFactor: 2,
                          ),
                        ),
                      ))
                  .toList()),
        ),
      ),
    );
  }
}

GIF 2020-8-20 14-55-59.gif

我学习flutter的整个过程都记录在里面了
https://www.jianshu.com/c/36554cb4c804

最后附上demo 地址

https://github.com/tsm19911014/tsm_flutter