constraint-layout

还记得2016 Google I/O 发布一个炫酷的布局编辑器，接着Android Studio 2.3 的发布，新建应用ConstrainLayout 就成默认根布局组件。这一系列的动作发生太巧妙，可能考虑到稳定性及时间的问题，当时并没有花太多的时间去了解，也没有在项目中引用。直到上个月新来的一些交互需要，图片真是想搁哪就搁哪。这时才想起这个支持库来。
'com.android.support.constraint:constraint-layout:+" 从发布至今，已有一年多了，目前稳定版是：1.0.2(2017.03发布)，且1.1.0-beta+似乎添加了许多新功能。

constraint-layout 这个依赖库中：最主要的类就是ConstraintLayout这个组布局，对其官方的介绍

ConstraintLayout allows you to create large and complex layouts with a flat view hierarchy (no nested view groups). It's similar to RelativeLayout in that all views are laid out according to relationships between sibling views and the parent layout, but it's more flexible than RelativeLayout and easier to use with Android Studio's Layout Editor.

其具体使用及约束：参见官方文档Build a Responsive UI with ConstraintLayout

所有约束：参见官方文档ConstraintLayout

---

接下来分析几个场景及主要约束的使用

案例1：指定View在Parent中所占的比例

左边时间部分要占屏幕宽度的21%

看到上面的图首先会想到比例LinearLayout+weight也可以做到，然而这样做的话就会导致左边的时间和右边的标题在两个不同的父容器里面。为了完成这个比例工作布局就需要两层，且还需要代码对位置的调控才能达到效果。

这个时候我需要介绍一下constraint-layout这个包中的Guideline 这个简单的View，其Visiblity 属性固定为View.GONE，并重写了setVisibility(int visibility)方法 ,所以在实际视图中该View是不会显示的，作ConstraintLayout的工具类使用。

 <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.2" />
        

orientation="vertical"|"horizontal"代表水平分割还是垂直分割

约束有：

• layout_constraintGuide_percent 百分比约束
• layout_constraintGuide_begin 开始位置约束
• layout_constraintGuide_end 结束位置约束

案例2 平分总宽度且按一定宽高比设置高度

constraintlayout_sample2.png

设置宽高约束layout_constraintDimensionRatio

单边固定时：建议缺省前辍，直接使用“宽：高”

宽固定时：layout_constraintDimensionRatio = "宽:高"

等同于layout_constraintDimensionRatio = "h,宽:高"

等同于layout_constraintDimensionRatio = "w,高:宽"

高固定时：layout_constraintDimensionRatio = "宽:高"

等同于layout_constraintDimensionRatio = "w,宽:高"

等同于layout_constraintDimensionRatio = "h,高:宽"

举个反例：

<ImageView
        android:id="@+id/imageView1"
        android:layout_width="0dp"
        android:layout_height="200dp"
        app:layout_constraintDimensionRatio="h,7:3"
        app:layout_constraintLeft_toRightOf="@+id/guideline"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="?attr/colorAccent" />

constraintlayout_sample2_1.png

注意：Android Studio此时宽高的位置显示是有问题的

宽高都为自适应时：（即 android:layout_width="0dp"和 android:layout_height="0dp"同时设置）

• 如果宽或高仅有一个为双约束（分别是左右约束或上下约束），可视为单边固定的情况

• 如果宽、高为双约束（另外如果两个都没有双约束则view的大小为0）
  注：缺省前辍相当于前辍为h，即取宽满足约束最大值再按比例【宽：高】计算高, 以w为前辍时先取满足高约束的量大值再按比率【宽：高】计算宽

综上所述,在单边固定或宽和高自适合单边双约束时不要使用前辍。

要完成案例2还需要配合ChainStyle一起操作，但是Chain不能视为当前方向的双约束。。。。所以设置比例还是写代码吧。