单一控件
居中
上下左右全部居中，通过基础篇介绍的位置属性实现
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
居上
对Bottom不做约束即可实现居上的效果
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
居下
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
居左
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
居右
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
左上
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
右下
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
水平任意位置
app:layout_constraintHorizontal_bias可以指定水平方向任意位置
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_bias="0.3" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
垂直任意位置
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintVertical_bias="0.7" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
任意位置
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_bias="0.8" app:layout_constraintVertical_bias="0.4" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
双控件
相对于单个子View来说，多个子View的布局才能凸显ConstraintLayout的优势
垂直等分
通过位置属性增加约束后，默认就是等分剩余空间
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toTopOf="@id/button2" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toBottomOf="@id/button1" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
水平等分
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
偏移（Space）
在等分基础上实现一定的偏移。一个做法是通过插入Space，配合app:layout_constraintHorizontal_weight实现
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/space1" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button1" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="1" /> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toEndOf="@id/space1" app:layout_constraintEnd_toStartOf="@id/space2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="2"/> android:id="@+id/space2" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="1" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/space2" app:layout_constraintEnd_toStartOf="@id/space3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="2" /> android:id="@+id/space3" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="2" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
偏移（bias）
第二种实现偏移的方式是使用bias
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_bias="0.4" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_bias="0.9" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
紧贴一端
先使用spread两端对齐父容器，然后通过bias对一个View进行偏移
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_bias="0.3" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
内部紧贴
使用app:layout_constraintHorizontal_chainStyle="packed"
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
偏移
内部紧贴的基础上，可以使用bias进行偏移
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintHorizontal_bias="0.3" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
垂直方向偏移
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintVertical_bias="0.4"/> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintVertical_bias="0.7"/>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
内部间隔
内部贴近的基础上，通过layout_margin增加间隔
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintHorizontal_bias="0.3" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" android:layout_marginStart="15dp"/>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
平分空间
两个子View平分父容器控件。
同时指定android:layout_width="0dp" 以及 app:layout_constraintHorizontal_chainStyle="spread"
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
调整比例
使用app:layout_constraintHorizontal_weight改变比例
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="3" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="2" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
紧贴两端
使用app:layout_constraintHorizontal_chainStyle="spread_inside"是两个子View紧贴两端
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread_inside" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
调整比例
增加space，width指定0并指定app:layout_constraintHorizontal_weight
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/space1" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="3"/> android:id="@+id/space1" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="2" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/space1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="1" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
两端对齐
控件的两端对齐，减少一端的约束可以实现单端对齐
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="140dp" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="70dp" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBottom_toBottomOf="@id/button1" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
中心对齐边缘
一个控件的中心对齐另一个控件边缘
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="140dp" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="70dp" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toBottomOf="@id/button1" app:layout_constraintBottom_toBottomOf="@id/button1" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
文字对齐
使用TextView的时候，通过app:layout_constraintBaseline_toBaselineOf对内部文字进行各种对齐
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="140dp" android:text="1" android:gravity="bottom|center" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="70dp" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBaseline_toBaselineOf="@id/button1"/>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
三控件
水平等分
与双控件的水平等分一样
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
偏移
与双控件相同，略。
内部贴近
与双控件一样app:layout_constraintHorizontal_chainStyle="packed"
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
偏移
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintHorizontal_bias="0.3" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
内部间隔（1）
1、2贴近，3通过layout_margin进行间隔
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" android:layout_marginEnd="15dp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
内部间隔（2）
通过layout_margin三个控件互相间隔
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintHorizontal_bias="0.3" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" android:layout_marginStart="10dp"/> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" android:layout_marginStart="15dp"/>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
平分空间
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="0dp" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
调整比例
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="1" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="2" /> android:id="@+id/button3" android:layout_width="0dp" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="4" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
紧贴两端
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread_inside" /> android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" /> android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
调整比例
与双控件一样， 使用Space调整
android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@id/space1" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="4" /> android:id="@+id/space1" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toEndOf="@id/button1" app:layout_constraintEnd_toStartOf="@id/button2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="1" /> android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toEndOf="@id/space1" app:layout_constraintEnd_toStartOf="@id/space2" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="4" /> android:id="@+id/space2" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintStart_toEndOf="@id/button2" app:layout_constraintEnd_toStartOf="@id/button3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="3" /> android:id="@+id/button3" android:layout_width="0dp" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toEndOf="@id/space2" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHorizontal_weight="4" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
更多控件
条目
多个控件左对齐并且通过padding增加垂直间隔
android:layout_width="match_parent" android:layout_height="match_parent" android:padding="20dp" xmlns:app="http://schemas.android.com/apk/res-auto"> android:id="@+id/button1" android:layout_width="200dp" android:layout_height="wrap_content" android:text="1" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> android:id="@+id/button2" android:layout_width="70dp" android:layout_height="wrap_content" android:text="2" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/button1" /> android:id="@+id/button3" android:layout_width="170dp" android:layout_height="wrap_content" android:text="3" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/button2" /> android:id="@+id/button4" android:layout_width="140dp" android:layout_height="wrap_content" android:text="4" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/button3" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
复杂列表
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="72dp" android:paddingEnd="16dp" android:paddingRight="16dp"> android:id="@+id/icon" android:layout_width="72dp" android:layout_height="72dp" app:layout_constraintLeft_toLeftOf="parent" /> android:id="@+id/title" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintBottom_toTopOf="@+id/text" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toEndOf="@id/icon" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_chainStyle="packed" tools:text="Title" /> android:id="@+id/text" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toEndOf="@id/icon" app:layout_constraintTop_toBottomOf="@id/title" tools:text="text" />
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
————————————————
版权声明：本文为CSDN博主「fundroid_方卓」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/vitaviva/article/details/106736575