android基础 | 第二课：约束布局(ConstraintLayout)

思考：

平时开发过程中提的最多的就是优化，ConstraintLayout就是应布局优化而生，它的出现是为了解决复杂布局时，布局嵌套层级过多，引起过度绘制问题。

Android 2.2 版本中添加了新布局编辑器，支持直接在布局编辑器当中拖动控件、添加约束条件。但是不建议拖拽，因为还需要二次修改，而且复杂布局实现不了。所以让我们一起来学习ConstraintLayout吧。

开撸：

查看 build.gradle中是否添加了下面代码，最新的android studio中新建项目是默认添加的。

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

1、基础属性

1、layout_constraintStart_toStartOf = layout_constraintLeft_toLeftOf
表示此控件的左边框与某个控件的左边框对齐或者在其右边

//相对于父布局
app:layout_constraintStart_toStartOf="parent"
//相对于兄弟控件
app:layout_constraintStart_toStartOf="@+id/id"

同上，下面用法一致：
2、layout_constraintEnd_toEndOf = layout_constraintRight_toRightOf
表示此控件的右边框与某个控件的右边框对齐或在其左边
3、app:layout_constraintTop_toTopOf
表示此控件的顶部边框与某个控件的顶部边框水平对齐或在其下边
4、app:layout_constraintBottom_toBottomOf
表示此控件的底部边框与某个控件的底部边框水平对齐或其上边
5、layout_constraintStart_toEndOf = layout_constraintLeft_toRightOf
表示此控件的左边框与某个控件的右边框对齐或者在其右边
6、layout_constraintEnd_toStartOf = layout_constraintRight_toLeftOf
表示此控件的右边框与某个控件的左边框对齐或在其左边
7、app:layout_constraintTop_toBottomOf
表示此控件的顶部边框与某个控件的底部边框水平对齐或在其下边
8、app:layout_constraintBottom_toTopOf
表示此控件的底部边框与某个控件的顶部边框水平对齐或其上边

2、特殊属性

1、app:layout_constraintBaseline_toBaselineOf
表示此控件与某个控件水平对齐

2、app:layout_editor_absoluteX
表示此控件在布局中X轴的绝对坐标点。
3、app:layout_editor_absoluteY
表示此控件在布局中Y轴的绝对坐标点
4、app:layout_constraintHorizontal_bias
表示此控件在布局中的水平方向上的偏移百分百
app:layout_constraintHorizontal_bias=”0.2”：设置相对父控件距离的长度的为父控件的宽度0.2倍的位置
5、app:layout_constraintVertical_bias
表示此控件在布局中的的垂直方向上的偏移百分百
layout_constraintVertical_bias=”0.2”:设置相对父控件距离的长度的为父控件的长度0.2倍的位置
6、app:layout_constraintDimensionRatio
表示两个控件的纵横比，而使用则需要把宽（layout_width）或者高（layout_height）设置为0dp，根据另一个属性和比例, 计算当前属性。

3、基准线（Guideline）

Guideline是一条隐形的线，这条线可作为准线，根据此准线设置其他控件的位置。
Guideline是一个View(android.support.constraint.Guideline)，基准线的通过android:orientation设置方向。通过基准线来约束其他的view。
layout_constraintGuide_begin=”xxdp”：基准线开始方向xxdp
layout_constraintGuide_end=”xxdp”：基准线结束方向xxdp
layout_constraintGuide_percent=”0.3”：基准线开始方向距离的父控件大小的百分比。

其他控件对这个控件使用方法：

app:layout_constraintTop_toBottomOf="@+id/guide" 

4、链状结构（Chain Style）

Chain Style是使多个控件像链条一样显示，这个更能可以类似LinearLayout的weight属性。
要想chain style生效，控件要相互引用，比如A的右边依赖B的左边，B的左边依赖A的右边，都是设置。 如:水平方向的Chain Style.

Chain Style的分为水平和竖直方向，每种都有3中模式：
layout_constraintHorizontal_chainStyle=”spread”：均匀分布（包括边上控件左右的边距）
layout_constraintHorizontal_chainStyle=”spread_inside”：均匀分布，但是边上的控件不均匀分布（边上控件没有边距）
layout_constraintHorizontal_chainStyle=”packed”：控件紧挨在一起。还可以通过bias属性设置偏移量。
layout_constraintHorizontal_weight=""：跟线性布局的weight差不多，width需要设置0dp，控件的大小根据设置的weight比例进行设置。
layout_constraintVertical_chainStyle=”“:和上面一样，有三种模式spread，spread_inside，packed。
layout_constraintVertical_weight=""：

5、其他

ConstraintLayout控件的其他属性
layout_constraintWidth_min=""：最小宽度
layout_constraintWidth_max=""：最大宽度
layout_constraintHeight_min=""：最小高度
layout_constraintHeight_max=""：最大高度

eg：

结束语：

关于ConstraintLayout还有其他的属性，不过用的不是很多，希望大家一定要多动手，这样才能熟练掌握。

GitHub：https://github.com/DaveSally/MyDemo

欢迎大家关注我的公众号：受伤的粽子