android-view篇-ConstraintLayout 约束布局

概述

ConstraintLayout 主要是为了解决布局嵌套过多的问题，以灵活的方式定位和调整小部件。Android Studio 2.3 开始，官方模板默认使用 ConstraintLayout。

添加依赖，如下：

implementation 'com.android.support.constraint:constraint-layout:1.1.3'
package android.support.constraint;

implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
package androidx.constraintlayout.widget;

相对定位

1. layout_constraintLeft_toLeftOf
2. layout_constraintLeft_toRightOf
3. layout_constraintRight_toLeftOf
4. layout_constraintRight_toRightOf
5. layout_constraintTop_toTopOf
6. layout_constraintTop_toBottomOf
7. layout_constraintBottom_toTopOf
8. layout_constraintBottom_toBottomOf
9. layout_constraintBaseline_toBaselineOf：约束文本基线
10. layout_constraintStart_toEndOf
11. layout_constraintStart_toStartOf
12. layout_constraintEnd_toStartOf
13. layout_constraintEnd_toEndOf

<Button android:id="@+id/buttonA" ... />

<Button android:id="@+id/buttonB" ...
    app:layout_constraintLeft_toRightOf="@+id/buttonA" />

They all take a reference id to another widget, or the parent (which will reference the parent container, i.e. the ConstraintLayout):

<Button android:id="@+id/buttonB" ...
    app:layout_constraintLeft_toLeftOf="parent" />

边距

1. android:layout_marginStart
2. android:layout_marginEnd
3. android:layout_marginLeft
4. android:layout_marginTop
5. android:layout_marginRight
6. android:layout_marginBottom

**注：**设置边距时，需要约束控件在ConstraintLayout里的位置。

如果目标View不可见（View.GONE）时，可以通过以下属性设置不同的边距：

1. layout_goneMarginStart
2. layout_goneMarginEnd
3. layout_goneMarginLeft
4. layout_goneMarginTop
5. layout_goneMarginRight
6. layout_goneMarginBottom

居中和偏移

居中：

<EditText
    android:id="@+id/edt"
    ...
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

偏移（赋值0-1）：

1. layout_constraintHorizontal_bias：水平偏移
2. layout_constraintVertical_bias：垂直偏移

Circular positioning

1. layout_constraintCircle : references another widget id
2. layout_constraintCircleRadius : 组件间的中心距离
3. layout_constraintCircleAngle : which angle the widget should be at (in degrees, from 0 to 360)

尺寸约束

1. 指定尺寸大小
2. wrap_content
   android:minWidth ：最小宽度
   android:minHeight ：最小高度
   android:maxWidth ：最大宽度
   android:maxHeight ：最大高度
   app:layout_constrainedWidth=”true|false”
   app:layout_constrainedHeight=”true|false”
3. 0dp
   注: MATCH_PARENT is not recommended for widgets contained in a ConstraintLayout. Similar behavior can be defined by using MATCH_CONSTRAINT with the corresponding left/right or top/bottom constraints being set to “parent”.
4. 百分比
   layout_constraintWidth_min and layout_constraintHeight_min : will set the minimum size for this dimension
   layout_constraintWidth_max and layout_constraintHeight_max : will set the maximum size for this dimension
   layout_constraintWidth_percent and layout_constraintHeight_percent : will set the size of this dimension as a percentage of the parent

• app:layout_constraintWidth_default=“percent”
• app:layout_constraintHeight_default=“percent”

5. Ratio比例

<Button 
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    app:layout_constraintDimensionRatio="1:1" />
    
width:height

链

Chain Style：链的第一个控件是这条链的链头，可以在链头中设置
layout_constraintHorizontal_chainStyle、layout_constraintVertical_chainStyle

• CHAIN_SPREAD(default style)
• Weighted chain
• CHAIN_SPREAD_INSIDE：展开元素，链的两端贴近parent；
• CHAIN_PACKED：链的元素将被打包在一起。

Group

Group将多个控件归为一组，方便隐藏或显示一组控件。

Guideline

参考

• ConstraintLayout