一. Padding 填充： 可以给其子节点添加填充留白和边距效果类似；
- EdgeInsets 主要属性
- fromLTRB 四个方向的填充
- all 所有方向相同填充
- only 单个方向
- Symmetric({vertical,horizontal}) 对称方向填充 ； vertical指top和 bottom ， horizontal 指left和right；
二. 尺寸限制类容器 eg:ConstrainedBox、 sizedBox 、 UnconstrainedBox、 AspectRatio等
- ConstrainedBox 用于对子控件添加额外的约束；
- BoxConstraints 用于设置限制条件 ；BoxConstraints.tight(Size size) 可以生成给定大小的限制； const BoxConstraints.expand() 生成一个尽可能大的用于填充另外一个容器的BoxConstraints;
- minWidth：double.infinity, 宽度尽可能大
- SizeBox : 用于给子元素指定固定的宽高；
- 多重限制：多重限制时 对于 minWidth和minHeight 来说 是取相应数值较大的；
三、DecoratedBox 装饰容器
- DecoratedBox : 可以在子组件绘制一些装饰：eg 背景、边框i、渐变等
- decoration 代表将要绘制的装饰 ； Decoration定义了接口 createBoxPainter（） 通过实现它来创建一个画笔 用于绘制装饰
- position：决定在哪里绘制 ；有两个值 background 在子控件之后绘制 背景装饰， foreground： 在子控件之上 绘制 ，前景；
- BoxDecoration ： 是Decoration的子类 、、、 BoxDecoration({ Color color, //颜色 DecorationImage image,//图片 BoxBorder border, //边框 BorderRadiusGeometry borderRadius, //圆角 List boxShadow, //阴影,可以指定多个 Gradient gradient, //渐变 BlendMode backgroundBlendMode, //背景混合模式 BoxShape shape = BoxShape.rectangle, //形状 }) 、、、
四、 Container 组合类容器
- container 组合类容器 本身不对应具体的RenderObject,它是DecoratedBox、 ConstrainedBox、 Transform 、 padding、 Align 等组件组合的一个多功能容器； 、、、 Container({ this.alignment, this.padding, //容器内补白，属于decoration的装饰范围 Color color, // 背景色 color和decoration互斥 同时设置会报错 ；color内部会自动创建一个decoration； Decoration decoration, // 背景装饰 Decoration foregroundDecoration, //前景装饰 double width,//容器的宽度 double height, //容器的高度 BoxConstraints constraints, //容器大小的限制条件 this.margin,//容器外补白，不属于decoration的装饰范围 this.transform, //变换 this.child, }) 、、、
五、 Scaffold、 TabBar 、 底部导航
组件名称 解释 AppBar 一个导航栏骨架 MyDrawer 抽屉菜单 BottomNavigationBar 底部导航栏 FloatingActionButton 漂浮按钮
- AppBar scaffold.of(context) 获取父级最近的Scaffold组件的state对象 TaBar的tabs属性接受一个Widget数组 ； TabController 监听Tab菜单的切换Tab方法 ： _tabController.addListener(); TabBarView 组件可以配合TabBar来实现同步切换和滚动状态同步；
- 抽屉菜单Drawer Scaffold 的drawer和endDrawer 左右抽屉菜单；
-
FloatingActionButton ：是Material设计总的一种特殊Button 通常悬浮在页面某一个位置作为某种常用动作快捷入口； - BottomAppBar的shape属性决定洞的外形，CircularNotchedRectangle 实现一个圆形的外形；
六、 裁剪 Clip
- 裁剪函数 | 裁剪函数 | 作用 | | ClipOval | 子组件为正方形时 裁剪成内贴圆形 ；为长方形 裁剪为内贴椭圆 | | ClipRRect | 子组件裁剪为圆形矩形 | | ClipRect | 裁剪子组件到实际占用矩形大小 | widthFactor: .5 表示宽度设为原来宽度的一半
- CustomClipper ：裁剪特定区域 、、、 class MyClipper extends CustomClipper { @override Rect getClip(Size size) => Rect.fromLTWH(10.0, 15.0, 40.0, 30.0); @override bool shouldReclip(CustomClipper oldClipper) => false; } 、、、
- getClip() 用于获取裁剪区域接口
- shouldReclip（）是否从新裁剪
