前言

参考于 flutter常用组件整理 - 知乎 (zhihu.com) （指大部分抄袭）

MaterialApp

Scaffold

AppBar

TabBar

Padding、AnimatedPadding

Padding增加组件间的间距，AnimatedPadding用于Padding需要改变大小并且增加动画效果

//paddingValue值改变会有动画效果
AnimatedPadding(
   padding: EdgeInsets.all(paddingValue),
   duration: Duration(milliseconds: 1000),
   curve: Curves.easeInOut,
   child: Container(
      width: MediaQuery.of(context).size.width,
      height: MediaQuery.of(context).size.height / 4,
      color: Colors.blue,
   ),
   onEnd: () {
      print("动画结束");
    },
),

Align、AnimatedAlign

Align用来确定子控件在布局中的位置，如居中、左上等多个对齐方式。

ConstrainedBox、BoxConstraints

ConstrainedBox

BoxConstraints

SizeBox、FittedBox

SizeBox

FittedBox当子组件的内容超出父组件大小时，FittedBox的作用是对子组件进行缩放和对齐方式的设置。

OverflowBox、SizedOverflowBox

OverflowBox允许子组件超出父组件的边界

SizedOverflowBox也允许子组件超出父组件的边界，但是它与OverflowBox不同的在于还可以对子组件进行尺寸部分的限制。

AspectRatio、FractionallySizedBox

AspectRatio主要作用是调整子组件设定的宽高比，如播放视频时16:9或4:3等，aspectRatio纵横比例

AspectRatio(
   aspectRatio: 16 / 9,
   child: Container(
      color: Colors.orangeAccent,
   ),
),

FractionallySizedBox当我们需要一个控件的尺寸是相对尺寸时，比如当前按钮的宽度占父组件的70%

 FractionallySizedBox(
    alignment: Alignment.topLeft,
    widthFactor: 1.5, //宽度为父组件的1.5倍
    heightFactor: 0.5, //高度为父组件的0.5倍
    child: new Container(
       color: Colors.red,
    ),
),

Container、AnimatedContainer

AnimatedContainer是Container的动画版本，需要在改变宽高、颜色等需要增加动画效果时使用

ClipRect、ClipRRect

ClipRect给子组件裁剪为给定的矩形大小

ClipRRect使用圆角矩形剪辑子组件

ClipOval、ClipPath

ClipOval是裁剪子组件为椭圆的组件，属性同ClipRect

ClipPath是可以使用路径裁剪的组件，属性同ClipRect

Center

对子组件进行居中的时候使用