滚动组件SingleChildScrollView

像Row、Column、Flex等有些widget是无法进行滚动的，一旦子控件超出父控件的范围，flutter会发出警告，屏幕会有黄黑色条纹出现，这时我们可以使用滚动控件来进行处理。

import 'package:flutter/material.dart';
import 'dart:math';
class SingleChildScrollViewDemo extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      crossAxisAlignment: CrossAxisAlignment.baseline,
      mainAxisSize: MainAxisSize.max,
      textDirection: TextDirection.ltr,
      verticalDirection: VerticalDirection.down,
      textBaseline: TextBaseline.alphabetic,
      children: getContainers(20),
    );
  }
  
  List<Widget> getContainers (int length) {
    List<Widget> list = List();
    for (int i = 0; i < length; i++) {
      list.add(Container(
        width: double.infinity,
        height: 50.0,
        margin: EdgeInsets.only(top: 10.0),
        color: Colors.lightBlueAccent,
      ));
    }
    return list;
  }
}

 Widget build(BuildContext context) {
    // TODO: implement build
    return SingleChildScrollView(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        crossAxisAlignment: CrossAxisAlignment.baseline,
        mainAxisSize: MainAxisSize.max,
        textDirection: TextDirection.ltr,
        verticalDirection: VerticalDirection.down,
        textBaseline: TextBaseline.alphabetic,
        children: getContainers(20),
      ),
    );
  }

 为解决这一问题我们可以使用ListView或GridView进行布局，为了方便可以直接在Column外面嵌套一个SingleChildScrollView：