ConstraintLayout属性整理

当前控件的X侧在XX控件的X侧

app:layout_constraintBottom_toBottomOf="@+id/"
app:layout_constraintBottom_toTopOf="@+id/"

app:layout_constraintEnd_toEndOf="@android:"
app:layout_constraintEnd_toStartOf="@android:"

app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintLeft_toRightOf="@+id/"

app:layout_constraintRight_toLeftOf="@+id/"
app:layout_constraintRight_toRightOf="@+id/"

app:layout_constraintTop_toBottomOf="@+id/"
app:layout_constraintTop_toTopOf="parent"

 app:layout_constraintStart_toEndOf="@android:"
 app:layout_constraintStart_toStartOf="@android:"

app:layout_constraintBaseline_toBaselineOf="@+id/"

例如：

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/header_constrain_edit_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#cccccc">
        <!--布局间相互连接, aaa====bbb, bbb====ccc, 头布局声明连(chainStyle),必须要在头布局声明-->
        <TextView
            android:id="@+id/aaaaa"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginEnd="4dp"
            android:text="AAAAAAAA"
            android:background="#0000ff"
            app:layout_constraintHorizontal_chainStyle="packed"　　//重点
            app:layout_constraintEnd_toStartOf="@+id/bbbbb"　　//重点
            app:layout_constraintStart_toStartOf="parent"　　//重点
            app:layout_constraintBottom_toBottomOf="parent"　　//重点
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/bbbbb"
            android:layout_width="wrap_content"
            android:layout_height="@dimen/public_ui_25dp"
            android:layout_gravity="center"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:gravity="center"
            android:text="BBBBBBBBBB"
            android:background="#ff0000"
            app:layout_constraintStart_toEndOf="@+id/aaaaa"　　//重点
            app:layout_constraintEnd_toStartOf="@+id/ccccc"　　//重点
            android:textColor="@color/public_color_CCCCCC"　　//重点
            android:textSize="@dimen/public_font_14sp"
            app:layout_constraintBottom_toBottomOf="parent"　　//重点
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/ccccc"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#00ff00"
            app:layout_constraintEnd_toEndOf="parent"　　//重点
            app:layout_constraintStart_toEndOf="@+id/bbbbb"　　//重点
            app:layout_constraintBottom_toBottomOf="parent"　　//重点
            app:layout_constraintTop_toTopOf="parent"　　//重点
            android:text="CCCCCCCCC"/>

    </androidx.constraintlayout.widget.ConstraintLayout>

控制当前 View 所参考的 View 状态为 GONE 的时候的 margin 值

          app:layout_goneMarginBottom="10dp"
          app:layout_goneMarginEnd="10dp"
          app:layout_goneMarginLeft="10dp"
          app:layout_goneMarginRight="10dp:"
          app:layout_goneMarginStart="10dp"
          app:layout_goneMarginTop="10dp"

demo

    <TextView
        android:id="@+id/AAA"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ff00ff"
        android:visibility="gone"
        android:text="AAAAAAAAAAAAAAAA" />

    <TextView
        android:id="@+id/BBB"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ff0000"
        app:layout_constraintStart_toEndOf="@+id/AAA" 　　　　//重点
        app:layout_goneMarginLeft="@dimen/public_ui_50dp"  　//重点
        android:text="BBBBBB" />

设置当前控件宽高比例：（前提设置一个宽或者高为0，或者使用强制约束）

       app:layout_constraintDimensionRatio="16:9"// 数值支持两种形式：1.float值，代表宽度/高度的比率；2.比率值,宽：高（5：6），高：宽（H,5：6）

demo

<ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="W,169:690"
        android:background="@drawable/ic_launch_logo" />

设置当前控件的偏重：（前提：是当前控件有“不可能”实现的约束的时候：例如，水平约束：控件宽30dp，父控件宽100dp，设置即在父窗体的左边，又在父窗体的右边，这种"不可能"实现的最终会居中显示）

        app:layout_constraintHorizontal_bias="0.3"// 空余区域左边占0.3
        app:layout_constraintVertical_bias="0.3"// 空余区域左边占0.3

demo

<ImageView
      android:layout_width="50dp"
      android:layout_height="80dp"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintHorizontal_bias="51080"
      android:background="#ff0000" />

设置当前控件位置：（圆形定位：以另一个控件 layout_constraintCircle 为参照物画半径为 layout_constraintCircleRadius 的圆形，在角度 layout_constraintCircleAngle 的位置就是此控件的中心点，以此中心点布局此控件）

        app:layout_constraintCircle="@id/button1" // 引用另一个控件的id，以此控件为参照物
        app:layout_constraintCircleAngle="180" // 圆形的角度，值为：0-360
        app:layout_constraintCircleRadius="100dp" // 圆形的半径

demo

<ImageView
         android:id="@+id/AAA"
         android:layout_width="100dp"
         android:layout_height="50dp"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
         android:background="#ff0000" />
     <ImageView
         android:id="@+id/BBB"
         android:layout_width="30dp"
         android:layout_height="30dp"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintCircle="@+id/AAA"
         app:layout_constraintCircleAngle="125"
         app:layout_constraintCircleRadius="42dp"
         android:background="#ff00ff" />

设置当前最大值、最小值：（当 ConstraintLayout 设置为 WRAP_CONTENT 时生效）

    android:maxHeight
    android:maxWidth
    android:minHeight
    android:minWidth

设置控件宽高：

    使用特定的值
    使用 WRAP_CONTENT，它会要求计算自己的大小
    使用 0dp，相当于 MATCH_CONSTRAINT ，用约束规则指定的大小

设置是否强制约束：（控件有时候想要WRAP_CONTENT，但是当设置为 WRAP_CONTENT 时被视为没有约束，设置强制约束可同时拥有包裹和约束）

        app:layout_constrainedWidth="true"
        app:layout_constrainedHeight="true"

demo

 <ImageView
        android:id="@+id/CCCC"
        android:layout_width="30dp"
        android:layout_height="130dp"
        android:layout_marginLeft="50dp"
        app:layout_constraintStart_toStartOf="parent"
        android:background="#f00" />

    <TextView
        android:id="@+id/DDDD"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:text="2000000000000000000000"
        app:layout_constrainedHeight="true"
        app:layout_constraintTop_toTopOf="@+id/CCCC"
        app:layout_constraintBottom_toBottomOf="@+id/CCCC"
        android:background="#ff00ff" />

设置 MATCH_CONSTRAINT（0dp）后约束宽高

    // 宽
        app:layout_constraintWidth_default="percent" // 设置计算方式：取值范围：spread（默认）占用所有符合约束的空间、wrap 占用内容的空间、percent 百分比占用
        app:layout_constraintWidth_max="100dp"// 设置最大值：取值范围：warp、固定dp
        app:layout_constraintWidth_min="wrap"// 设置最小值：取值范围：warp、固定dp
        app:layout_constraintWidth_percent="0.9" // 设置当前值：取值范围：[0-max]，相对于父布局的(前提：需指定`app:layout_constraintWidth_default="percent"`)
    // 高：同上
        app:layout_constraintHeight_default="wrap"
        app:layout_constraintHeight_min="100dp"
        app:layout_constraintHeight_percent="0.5"

设置链的样式（在链条的第一个元素设置，剩余空间不包含边距。）

       app:layout_constraintVertical_chainStyle="spread" // 取值范围：
       spread（默认，元素将会分散开来，如果有控件设置 0dp，则权重分空余空间）、
       spread_inside（类似的，但是链的两个端点在两侧不会散开）、
       packed（这条链的元素将被打包在一起。layout_constraintHorizontal_bias、layout_constraintVertical_bias将会影响到元素的位置。）
       app:layout_constraintHorizontal_chainStyle="spread"

demo
https://www.jianshu.com/p/507846bd81c9

权重链里面分配剩余空间（前提：宽或高设置0dp）

        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintVertical_weight="2"

demo

    <ImageView
        android:id="@+id/CCCC"
        android:layout_width="0dp"
        android:layout_height="130dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/DDDD"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_weight="2"
        android:background="#f00" />

    <TextView
        android:id="@+id/DDDD"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="0"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="0.1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@+id/CCCC"
        android:background="#ff00ff" />

设置优化器：（可以设置多个，例如：direct|barrier|dimensions）

        app:layout_optimizationLevel="none" // 取值：none : 不优化
                        standard : 默认。仅优化直接和障碍约束
                        direct : 优化直接约束。
                        barrier : 优化屏障约束。
                        chain : 优化链约束(实验)
                        dimensions :优化尺寸测量(实验)，减少匹配约束元素的数量。

指定控件的绝对位置（通过这个属性指定位置的控件可以不需要约束关系）

        app:layout_editor_absoluteX="100dp"
        app:layout_editor_absoluteY="100dp"

设置辅助线（辅助布局使用，Guideline，其他控件基于此线找到自己的位置）

        android:orientation="vertical"
        app:layout_constraintGuide_begin="100dp"
        app:layout_constraintGuide_end="50dp"
        app:layout_constraintGuide_percent="0.8"

demo

<View
        android:id="@+id/guide"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintGuide_percent="0.5"
        android:orientation="vertical"/>

    <ImageView
        android:id="@+id/CCCC"
        android:layout_width="100dp"
        android:layout_height="130dp"
        app:layout_constraintTop_toTopOf="@+id/DDDD"
        app:layout_constraintBottom_toBottomOf="@+id/DDDD"
        app:layout_constraintStart_toEndOf="@+id/DDDD"
        android:background="#f00" />

    <TextView
        android:id="@+id/DDDD"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="250dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="@+id/guide"
        android:text="0"
        android:background="#ff00ff" />

设置引用的控件（常用于 Barrier Group Placeholder）

    app:constraint_referenced_ids="@string/app_name" // 设置 Barrier 引用的控件。可设置多个，设置的方式是：id, id。（无需加 @id/）

设置屏障（辅助布局使用，Barrier）

    app:barrierAllowsGoneWidgets="true"// 默认为 true，即当 Barrier 引用的控件被 GONE 掉时，则 Barrier 默认的创建行为是在已 GONE 掉控件的已解析位置上进行创建。如果设置为 false，则不会将 GONE 掉的控件考虑在内
    app:barrierDirection="bottom"// 设置 Barrier 方向。可设置的有：bottom、end、left、right、start、top。

demo

<TextView
        android:id="@+id/AAAA"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:text="AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"
        android:background="#f00" />
    <TextView
        android:id="@+id/BBBB"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@+id/AAAA"
        android:text="BBBBBBBBBBBBBBBBBBBBBBB"
        app:layout_constraintStart_toStartOf="parent"
        android:background="#ff00ff" />

    <androidx.constraintlayout.widget.Barrier
        android:id="@+id/barr"
        app:constraint_referenced_ids="AAAA,BBBB"
        app:barrierDirection="right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

设置组（辅助布局使用，Group，控制一组控件的可见性）

    android:visibility="gone"
    app:constraint_referenced_ids=""

设置组（辅助布局使用，Placeholder，占位）
http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2017/1019/8618.html

    app:content="@id/button3" // 将占位符变为有效的视图
    app:emptyVisibility="gone/invisible" // 设置当视图不存在时占位符的可见性。

设置动态约束（主要代码设置）

    app:constraintSet="@string/app_name"

以下属性查看原码发现目前没有用，可能后续版本中添加

        app:layout_constraintBaseline_creator="1"
        app:layout_constraintBottom_creator="2"
        app:layout_constraintLeft_creator="3"
        app:layout_constraintRight_creator="4"
        app:layout_constraintTop_creator="5"
        app:chainUseRtl="true"//

更多 ConstraintLayout动画移步:
ConstraintLayout 动画 |动态 Constraint |用 Java 实现的 UI
https://www.jianshu.com/p/575829baa39d