ConstraintLayout（约束布局）使用整理

ConstraintLayout里面的属性太多不容易记住，最近逛B站发现一个阿里P7的大神讲解的课，自己整理记录一下。

约束布局最少需要约束控件的两个方向的位置，即水平方向和垂直方向各一条边。

注意约束布局中没有match_parent属性

一、ConstraintLayout优点：

1、解决了布局的层级嵌套问题

2、布局适配度较高：主要体现在bias（偏移量）属性

二、当做百分比布局使用(解决布局适配问题)

1、控件宽高使用百分比：

android:layout_width="0dp"    //首先需要设置布局的宽或者高为0dp
app:layout_constraintWidth_default="percent" //使用约束布局默认宽高属性为百分比属性
app:layout_constraintWidth_percent="0.9"     //设置对应的百分比
android:layout_height="0dp"
app:layout_constraintHeight_default="percent"
app:layout_constraintHeight_percent="0.1"

2、偏移属性（该属性类似于三方的百分比布局，故而做布局适配比较重要）app:layout_constraintVertical_bias="0.5"       //垂直方向偏移量
app:layout_constraintHorizontal_bias="0.5"  //水平方向偏移量

注意：该属性使用注意事项：如需使用该属性需同时指定对应轴向的两条边才会生效，例如使用app:layout_constraintVertical_bias="0.5" 属性时需要同时指定当前控件的top边和bottom约束才能生效。该值默认为0.5居中位置，取值范围在0~1之间。

3、宽高比

 

三、当做相对布局使用（ConstrintLayout相当于是加强版的RelativeLayout）

1、与RelativeLayout差异：RelativeLayout包裹的控件的相对位置是对应控件整体的相对位置，而ConstraintLayout包裹的控件是对控件的上下左右四条边与相对控件的上下左右四条边的相对位置。

2、常用属性

 1）先上图：

 总结一下，上下左右四条边*2 + （start和end）*2 = 12个属性，这样一来就好记多了

如果在同一方向轴同时指定了两个方向的约束条件，该控件会在对应方向居中显示。

start和end属性与left和right属性的其实没什么区别，这里推荐使用start和end属性做左右方向的约束，这里主要是因为国内的书写方向是从左向右的，中东的一些地区可能会有从右向左的书写习惯。为了国际化兼容推荐使用前者，可以在清单文件中配置方向属性。

2）基线对其（layout_constraintBaseline_toBaselineOf），该属性用于文字基线对齐

3）设置margin边距问题：如果你需要给控件设置边距，你需要在对应方向上面有约束条件，否则不会生效。例如：设置marginTop属性需要给当前控件设置app:layout_constraintTop_toTopOf=""或者app:layout_constraintTop_toBottomOf=""属性

4)实现环形布局：

app:layout_constraintCircle="@id/tv_zero" //圆心
app:layout_constraintCircleAngle="30"     //偏移角度，当前为30度
app:layout_constraintCircleRadius="100dp" //偏移半径

四、当做线性布局使用

当做线性布局使用的时候主要使用到chain（链）属性：

layout_constraintHorizontal_chainStyle //水平布局时使用

layout_constraintVertical_chainStyle   //垂直布局时使用

其中属性有三种：spread_inside两端对齐 、spread 居中对齐、packed 压缩对齐

注意当做线性布局使用的时候需要给各个控件的对应轴线起始位置都进行约束

 1、权重（weight）使用：类似于线性布局

使用的时候还是注意对应轴线上面的控件需要指定首位都有约束才会生效

android:layout_width="0dp"
app:layout_constraintHorizontal_weight="1" //区分于线性布局的layout_weight

五、常用约束布局中的控件

1、辅助线：不可见的一条线，用于约束布局约束辅助

<androidx.constraintlayout.widget.Guideline
    android:id="@+id/guideline"
    android:layout_width="0dp"              //需指定宽、高一个为0dp
    android:layout_height="wrap_content"
    android:orientation="vertical"         //指定辅助线的方向
    app:layout_constraintGuide_percent="0.8" />  //用于显示辅助线的位置，根据屏幕对应方向的百分比，取值范围0~1

2、Barrier(分界线)：用于把控件进行隔离