爱不释手的ConstraintLayout

ConstraintLayout

• ConstraintLayout中文是约束布局，又称“加强版相对布局”。

  
  image.png

为什么要用ConstraintLayout?

• 性能优势
  性能比较结果表明：ConstraintLayout 在测量/布局阶段的性能比 RelativeLayout 大约高 40%：参考：解析ConstraintLayout的性能优势
  ▲ 测量/布局（单位：毫秒，100 帧的平均值）

也就是说进行布局优化时，可以考虑使用 ConstraintLayout 替换传统布局。

• 使用方便快捷，功能强大。

使用方式和基本特性

基本使用方法： layout_constraintxxx_toyyyOf
每个控件都有上下左右，对应控件属性top、bottom、left/start、right/end

xxx代表自己的上下左右
yyy代表约束控件的上下左右

特性一

ConstraintLayout要有垂直、水平方向的约束，不然会提示错误。不添加任何约束，默认在左上角。

layout_constraintTop_toTopOf="@id/a" 就是自己(B控件)的上面与A控件的上面约束(对齐) （相当于RelativeLayout的 layout_alignTop="@id/a"）
app:layout_constraintStart_toEndOf="@id/a" B控件的左面与A控件右面约束

ConstraintLayout和RelativeLayout效果一致

当上下都对齐：
RelativeLayout 中B控件高度和A控件一致
ConstraintLayout中 A、B控件纵向对齐居中显示
这是ConstraintLayout特性二:垂直/水平都有约束时，控件会居中对齐。
所以在ConstraintLayout中全屏居中代码为：
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"

ConstraintLayout特性三
wrap_content、match_parent、0dp的区别
看下面这段代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <Button
        android:id="@+id/a"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="100dp"
        android:text="A"
        />

    <Button
        android:id="@+id/b"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:layout_marginRight="20dp"
        android:layout_marginBottom="100dp"
        android:text="B"
        />

    <Button
        android:id="@+id/c"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:stateListAnimator="@null"
        app:layout_constraintTop_toTopOf="@+id/a"
        app:layout_constraintStart_toEndOf="@+id/a"
        app:layout_constraintBottom_toBottomOf="@id/b"
        app:layout_constraintEnd_toStartOf="@id/b"
        android:text="C"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

改变Button C的android:layout_height的值为

wrap_content： 自适应
0dp: 对齐的上下(左右)高度
match_parent：填满父布局ConstraintLayout

总结一下：

• ConstraintLayout要有垂直、水平方向的约束，不然会提示错误。
• 垂直/水平两个方向都有约束时，控件会居中对齐。
• wrap_content、match_parent、0dp有不同的显示效果。

参考：
Android新特性介绍，ConstraintLayout完全解析
https://developer.android.google.cn/reference/android/support/constraint/ConstraintLayout?hl=cn
android ConstraintLayout布局从入门到放弃
解析ConstraintLayout的性能优势