趁项目上线后的空档期，学习些潮流的技术。ConstrainLayout听说不错，就来使用一波。
相比传统布局，包括LinearLayout/RelativeLayout等主流布局，都有他们的局限，布局复杂时嵌套严重，难以维护，且不能拖拽编辑布局之间的约束关系，效率低下。所以ConstrainLayout石破天惊横空出世。
进入正题，看看它有什么强大之处。
拖拽布局是传统的操作，重点在于约束操作。根布局使用ConstrainLayout，所有子控件就可以使用约束操作。其中每个子控件周围都有四个“约束点”，拖动这些点可以为其添加四个方向上的约束，且实际布局代码也会自动生成。上图演示了一个button在根布局的居中操作。
添加约束后的控件可以伸缩，但是中心位置不变。如上图所示。
取消控件的约束有几种操作：
1.点击控件上的“约束点”，单独取消该点的约束
2.点击控件，再点击控件左下角的约束图标
3.点击布局顶部往上的工具栏的约束图标
上图演示了两个button之间的约束操作，上边的button底部与下边的button顶部形成约束，此时上边的按钮无论如何拖动，都只能在下边的按钮之上。
上图演示了控件的中心水平对齐。
点击顶部的工具栏“磁石”按钮即可以开关自动约束。当拖动控件到布局中心时，其四周会显示约束线，若此时取消拖动，则会自动添加四周的约束。
上图演示了button填满父布局的操作，简单高效。
上一个“matchparent”操作并没有完全填满父布局，因为父布局（ConstrainLayout）设置了padding值，该值可以通过顶部工具栏输入，如上图所示。
控件设置margin也简单，在布局右边的操作栏中可以输入控件四边的margin值。
控件的自身尺寸有三种模式：
Fixed: 固定尺寸，你可以设置控件的width/height属性来控制高和宽。
AnySize: 控件占据所有可用（约束范围内）的空间来满足约束。
Wrap Content: 控件所占有的空间是可缩放的，相当于“wrap_content“属性
链式布局有有4种模式：spread, packed, spread_inside。具体操作入如上图所示，样式如下图所示。
Guideline相当于一条辅助线，上图演示了竖直方向的。Guideline有3种模式，分别为距离左右两边多少dp、距离左边百分比。
四周约束（牵引）
layout_constraintLeft_toLeftOf: 将目标控件的左侧牵引到另外一个控件的左侧
layout_constraintRight_toLeftOf: 将目标控件的右侧牵引到另外一个控件的左侧
layout_constraintLeft_toRightOf: 将目标控件的左侧牵引到另外一个控件的右侧
layout_constraintRight_toRightOf: 将目标控件的右侧牵引到另外一个控件的右侧
layout_constraintTop_toTopOf: 将目标控件的上侧牵引到另外一个控件的上侧
layout_constraintTop_toBottomOf: 将目标控件的上侧牵引到另外一个控件的下侧
layout_constraintBottom_toTopOf: 将目标控件的下侧牵引到另外一个控件的上侧
layout_constraintBottom_toBottomOf: 将目标控件的下侧牵引到另外一个控件的下侧
基线对齐
layout_constrainBaseline_toBaselineOf:与目标控件的基线对齐
start，end类（与left,right类似）
layout_constrainStart_toEndOf:将目标控件的左侧与另一控件的右侧对齐
layout_constrainStart_toStartOf：将目标控件的左侧与另一控件的左侧对齐
layout_constrainEnd_toStartOf：将目标控件的右侧与另一控件的左侧对齐
layout_constrainEnd_toEndOf：将目标控件的右侧与另一控件的右侧对齐
布局边距
layout_marginStart:左边距
layout_marginEnd:右边距
layout_marginLeft:左边距
layout_marginRight:右边距
layout_marginLeft:左边距
layout_marginTop:上边距
layout_marginBottom:下边距
基准线（guideline）
orientation:vertical/horizontal 基准线的方向
layout_constrainGuide_begin:基准线起点
layout_constrainGuide_end:基准线终点
layout_constrainGuide_percent:基准线百分比模式，用于指定位置
牵引力
layout_constrainHorizontal_bias:水平方向上的牵引力
layout_constrainVertical_bias:垂直方向上的牵引力
链样式（ChainStyle）
layout_constrainHorizontal_chainStyle:水平方向上的样式
layout_constrainVertical_chainStyle:垂直方向上的样子
链权重
同样的，当几个控件组成链时，可以像LinearLayout一样，对其设置权重分布，调节大小
layout_constrainVertical_weight:设置该控件在链中的权重
宽高属性
ConstrainLayout的宽高属性与普通的布局有所不同，其属性分为三种：wrap_content，具体数值，match_contraint。其中前两种和其他布局类似，当宽高属性设置为match_contraint时，其xml属性显示为：0dp，表现属性为布满约束的区域。
与此同时，ConstrainLayout还支持一种比例的属性：
layout_constrainDimensionRatio:"w,13:2"/"h, 23:23",其中w,h可以不注明， 默认为宽高比
