版權信息
原始鏈接:[ConstraintLayout 終極秘籍](http://blog.chengyunfeng.com/?p=1030)(上)
---
個人筆記:
---
原文
[ConstraintLayout](https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html)?終于[正式發布 1.0 版本](http://tools.android.com/recent/constraintlayout10isnowavailable)了,是時候來詳細介紹下這個 Android 布局的終極武器了。
## 為何需要 ConstraintLayout
Android 上面布局嵌套層級直接影響 UI 界面繪制的效率,如果 UI 嵌套層級太多會導致界面有[性能問題](http://blog.venmo.com/hf2t3h4x98p5e13z82pl8j66ngcmry/performance-tuning-on-android),目前對于復雜的界面,使用?[RelativeLayout](https://developer.android.com/reference/android/widget/RelativeLayout.html)?也無法解決。所以 Android UI 團隊就在去年 Google IO 開發者大會上發布了一個新的布局控件 — ConstraintLayout。
ConstraintLayout 可以看做 RelativeLayout 的升級版。可以有更多的手段來控制里面的子 View 的布局,所以對于復雜的布局用 ConstraintLayout 一個布局容器即可實現。
## 設置開發環境
ConstraintLayout 是一個新的 Support 庫,支持 Android 2.3 (API level 9) 以及以后的版本。在 Android Studio 中使用 ConstraintLayout 之前需要先下載最新的 ConstraintLayout 庫,步驟如下:
1. 在 Android Studio 中選擇菜單?Tools?>?Android?>?SDK Manager
2. 點擊?SDK Tools?Tab 頁
3. 滾動到最下面找到?Support Repository?部分,然后勾選?ConstraintLayout for Android?和?Solver for ConstraintLayout?來安裝新的 1.0 版本。 (勾選界面右下方的 ** Show Package Details ** 可以查看已經安裝的版本。可以取消不需要的版本來卸載舊版本。)
4. 點擊?OK?或者?Apply?可以安裝需要的版本。
5. 安裝完以后,在你項目模塊的?build.gradle?中添加依賴項:
~~~Java
dependencies {
????compile 'com.android.support.constraint:constraint-layout:1.0.0'
}
~~~
1. 選擇?Sync Project with Gradle Files?來同步 Gradle 信息。
下載 ConstraintLayout 的截圖

然后就可以開始在項目中使用 ConstraintLayout 了。
## ConstraintLayout 布局屬性詳解
ConstraintLayout 中的 Constraint 為名詞(翻譯為:約束;限制;強制),所以顧名思義該布局在每個在子 View 上添加各種約束條件來控制每個子 View 所處的位置以及顯示的尺寸。ConstraintLayout 在 1.0 版本有如下?54?個布局屬性:
1. android_maxHeight
2. android_maxWidth
3. android_minHeight
4. android_minWidth
5. android_orientation
6. layout_constraintBaseline_creator
7. layout_constraintBaseline_toBaselineOf
8. layout_constraintBottom_creator
9. layout_constraintBottom_toBottomOf
10. layout_constraintBottom_toTopOf
11. layout_constraintDimensionRatio
12. layout_constraintEnd_toEndOf
13. layout_constraintEnd_toStartOf
14. layout_constraintGuide_begin
15. layout_constraintGuide_end
16. layout_constraintGuide_percent
17. layout_constraintHeight_default
18. layout_constraintHeight_max
19. layout_constraintHeight_min
20. layout_constraintHorizontal_bias
21. layout_constraintHorizontal_chainStyle
22. layout_constraintHorizontal_weight
23. layout_constraintLeft_creator
24. layout_constraintLeft_toLeftOf
25. layout_constraintLeft_toRightOf
26. layout_constraintRight_creator
27. layout_constraintRight_toLeftOf
28. layout_constraintRight_toRightOf
29. layout_constraintStart_toEndOf
30. layout_constraintStart_toStartOf
31. layout_constraintTop_creator
32. layout_constraintTop_toBottomOf
33. layout_constraintTop_toTopOf
34. layout_constraintVertical_bias
35. layout_constraintVertical_chainStyle
36. layout_constraintVertical_weight
37. layout_constraintWidth_default
38. layout_constraintWidth_max
39. layout_constraintWidth_min
40. layout_editor_absoluteX
41. layout_editor_absoluteY
42. layout_goneMarginBottom
43. layout_goneMarginEnd
44. layout_goneMarginLeft
45. layout_goneMarginRight
46. layout_goneMarginStart
47. layout_goneMarginTop
48. layout_optimizationLevel
49. layout_marginStart
50. layout_marginEnd
51. layout_marginLeft
52. layout_marginTop
53. layout_marginRight
54. layout_marginBottom
不要被數量嚇怕了,其實很簡單。這 48 個屬性一共可以分為 8 組,下面會按類型逐步分解。
### 一、ConstraintLayout 本身使用的屬性
* android_maxHeight
* android_maxWidth
* android_minHeight
* android_minWidth
這四個屬性就是 Android 里面常見的控制 View 最大尺寸和最小尺寸的屬性,可以設置到 ConstraintLayout 上來控制 ConstraintLayout 的尺寸信息。 這個比較簡單就不做介紹了
### 二、Guideline 使用的屬性
下面四個屬性為應用到?[Guideline](https://developer.android.com/reference/android/support/constraint/Guideline.html)?上面的, Guideline 是用來輔助定位的一個不可見的元素,后面會詳細介紹。
* android_orientation 控制 Guideline 是橫向的還是縱向的
* layout_constraintGuide_begin 控制 Guideline 距離父容器開始的距離
* layout_constraintGuide_end 控制 Guideline 距離父容器末尾的距離
* layout_constraintGuide_percent 控制 Guideline 在父容器中的位置為百分比
### 三、相對定位屬性
下面 13 個屬性是用來控制子 View 相對位置的,這些屬性和 RelativeLayout 的布局屬性非常類似,用來控制子 View 的某一個屬性相對于另外一個 View 或者 父容器的位置。
* layout_constraintBaseline_toBaselineOf
* layout_constraintTop_toBottomOf
* layout_constraintTop_toTopOf
* layout_constraintBottom_toBottomOf
* layout_constraintBottom_toTopOf
* layout_constraintStart_toEndOf
* layout_constraintStart_toStartOf
* layout_constraintEnd_toEndOf
* layout_constraintEnd_toStartOf
* layout_constraintLeft_toLeftOf
* layout_constraintLeft_toRightOf
* layout_constraintRight_toLeftOf
* layout_constraintRight_toRightOf
上面這些屬性命名非常有規律,例如前面的 layout 說明這是一個布局屬性,中間的?constraintXXX為對當前 View 上的某個屬性做的約束,而最后的?toXXOf?為當前 View 約束的對象以及約束的方位。
如下圖:

是通過如下的布局來實現的:
~~~xml
<Button android:id="@+id/buttonA" ... />
<Button android:id="@+id/buttonB" ...
app:layout_constraintLeft_toRightOf="@+id/buttonA" />
~~~
所實現的效果是 ButtonB 左邊位于 ButtonA 的右邊。這樣布局管理器就會把 ButtonB 的左邊和 ButtonA 的右邊對齊, A 的右邊和 B 的左邊位于同一個垂直位置。是不是非常簡單!
注意,所相對的對象可以是臨近的其他 子 View 也可以是 ConstraintLayout 自己,如果要把 ButtonB 的左邊 和 父容器(ConstraintLayout)的左邊對齊,則可以使用下面的方式(注意引用的控件為 parent ):
~~~xml
<Button android:id="@+id/buttonB" ...
app:layout_constraintLeft_toLeftOf="parent" />
~~~
下圖是每個 View 的上下左右以及 baseline 示意圖:

### 四、Margin (View 的邊距)
如果沒有 Margin 則兩個 View 會緊緊挨著,比如上面的 ButtonB 和 ButtonA 挨著。而很多情況下,設計的效果都要求 View 之間有間隔,這個時候就要使用 Margin 屬性了。
下圖為 Margin 的說明:

下面為控制 View margin 的屬性:
– layout_marginStart
– layout_marginEnd
– layout_marginLeft
– layout_marginTop
– layout_marginRight
– layout_marginBottom
margin 值只能為大于等于0的數字,這些都是很常見的屬性,不做詳細介紹了。
而下面 6 個是控制當前 View 所參考的 View 狀態為 GONE 的時候的 margin 值:
– layout_goneMarginBottom
– layout_goneMarginEnd
– layout_goneMarginLeft
– layout_goneMarginRight
– layout_goneMarginStart
– layout_goneMarginTop
比如 ButtonB 左邊相對于 ButtonA 右邊對齊,ButtonA 左邊相對于父容器左邊對齊。如果 ButtonA 的狀態為 GONE(不可見的),則 ButtonB 就相對于父容器左邊對齊了。如果有個需求是,當 ButtonA 不可見的時候, ButtonB 和父容器左邊需要一個邊距 16dp。 這個時候就需要使用上面的?layout_goneMarginLeft?或者?layout_goneMarginStart?屬性了,如果設置了這個屬性,當 ButtonB 所參考的 ButtonA 可見的時候,這個邊距屬性不起作用;當 ButtonA 不可見(GONE)的時候,則這個邊距就在 ButtonB 上面起作用了。
另外還有一個用途就是方便做 View 動畫,可以先設置 ButtonA 為 GONE,同時可以保持 ButtonB 的布局位置不變。
### 五、居中和偏移(bias)
ConstraintLayout 處理看起來沖突的約束比較有意思。例如:
~~~xml
android.support.constraint.ConstraintLayout ...>
????Button android:id="@+id/button" ...
????????app:layout_constraintLeft_toLeftOf="parent"
????????app:layout_constraintRight_toRightOf="parent/>
android.support.constraint.ConstraintLayout/>
~~~
上面約束?`Button`?的左邊和父容器左邊對齊,右邊和父容器右邊對齊,除非父容器`ConstraintLayout`和?`Button`?的寬度一樣,才能滿足這個條件,否則的話是無法滿足這個條件的。這樣情況下,`ConstraintLayout`?是如何處理的呢?
這種情況下,`ConstraintLayout`?就像使用兩個作用力分別從左邊和右邊來拉住這個 Button,就像 Button 左右一邊一個彈簧固定到父容器左右。最終的效果就是 Button 在父容器中水平居中。對于垂直方向上的約束是類似的規則。
居中布局示意圖:

#### Bias
像上面提到的這種對稱相反布局約束會把 View 居中對齊,使用 Bias 可以改變兩邊的權重(類似于 LinearLayout 中的 weight 屬性):
* layout_constraintHorizontal_bias
* layout_constraintVertical_bias
Bias 示意圖:

如果沒有設置 bias 值,則左右兩邊的取值為各占 50%,如果把左邊的 bias 值修改為 30%(0.3),則左邊空白的邊距就小一點,而右邊空白的距離就大一點,例如下面的代碼就可以實現類似上圖的效果:
~~~xml
android.support.constraint.ConstraintLayout ...>
????Button android:id="@+id/button" ...
????????app:layout_constraintHorizontal_bias="0.3"
????????app:layout_constraintLeft_toLeftOf="parent"
????????app:layout_constraintRight_toRightOf="parent/>
/android.support.constraint.ConstraintLayout>
~~~
### 六、子 View 的尺寸控制
ConstraintLayout 中子 View 的寬度和高度還是通過 android:layout_width 和 android:layout_height 來指定,可以有三種不同的取值:
– 使用確定的尺寸,比如 48dp
– 使用 WRAP_CONTENT ,和其他地方的 WRAP_CONTENT 一樣
– 使用?0dp,這個選項等于 “MATCH_CONSTRAINT”,也就是和約束規則指定的寬(高)度一樣
例如下圖:

(a) 設置為wrap_content;(b) 設置為 0dp,則 View 的寬度為整個父容器的寬度;(c) 是設置了 margin的情況下的寬度。
注意:?MATCH_PARENT 屬性無法在 ConstraintLayout 里面的 子 View 上使用。
#### 控制子 View 的寬高比
* layout_constraintDimensionRatio 控制子View的寬高比
除了上面三種設置 子 View 的尺寸以外,還可以控制 子 View 的寬高比。如果要使用寬高比則需要至少設置一個尺寸約束為 0dp,然后設置?`layout_constraintDimentionRatio`?屬性:
~~~xml
Button android:layout_width="wrap_content"
????android:layout_height="0dp"
????app:layout_constraintDimensionRatio="1:1" />
~~~
上面的代碼會設置 Button 的高度和寬度一樣。
比率的取值有兩種形式:
– float 值,代表寬度/高度 的比率
– “寬度:高度”這種比率值
如果寬度和高度都是 MATCH_CONSTRAINT (0dp) 也可以使用寬高比。這種情況,系統會使用滿足所有約束條件和比率的最大尺寸。要根據其中一種尺寸來約束另外一種尺寸,則可以在比率值的前面添加?`W`?或者?`H`來分別約束寬度或者高度。例如,如果一個尺寸被兩個目標約束(比如寬度為0dp,在父容器中居中),你通過使用字符?`W`?或者?`H`?來指定那個邊被約束。
例如:
~~~xml
Button android:layout_width="0dp"
????android:layout_height="0dp"
????app:layout_constraintDimensionRatio="H,16:9"
????app:layout_constraintBottom_toBottomOf="parent"
????app:layout_constraintTop_toTopOf="parent"/>
~~~
上面的 layout_constraintDimensionRatio 取值為?`H,16:9`,前面的 H 表明約束高度,所以結果就是 Button 的寬度和父容器寬度一樣,而高度值符合 16:9 的比率。
除了基本的 View 尺寸控制以為,還有如下幾個精細控制 View 尺寸的屬性(注意:下面這些屬性只有寬度或者高度設置為 0dp (MATCH_CONSTRAINT) 的情況下才有效):
* layout_constraintWidth_default
* layout_constraintHeight_default 取值為 spread 或者 wrap,默認值為 spread ,占用所有的符合約束的空間;如果取值為 Wrap ,并且view 的尺寸設置為 wrap_content 且受所設置的約束限制其尺寸,則 這個 view 最終尺寸不會超出約束的范圍。
* layout_constraintHeight_max 取值為具體的尺寸
* layout_constraintHeight_min 取值為具體的尺寸
* layout_constraintWidth_max 取值為具體的尺寸
* layout_constraintWidth_min 取值為具體的尺寸
下圖為各個取值的示意圖:

### 七、鏈條布局(Chains)
Chains 為同一個方向(水平或者垂直)上的多個子 View 提供一個類似群組的概念。其他的方向則可以單獨控制。
#### 創建一個 Chain
多個 View 相互在同一個方向上雙向引用就創建了一個 Chain。什么是雙向引用呢? 比如在水平方向上兩個 Button A 和 B,如果 A 的右邊位于 B 的左邊,而 B 的左邊位于 A 的右邊,則就是一個雙向引用。如下圖:

> 注意: 在 Android Studio 編輯器中,先把多個 View 單向引用,然后用鼠標擴選多個 View,然后在上面點擊右鍵菜單,選擇 “Center Horizontally” 或者 “Center Vertically” 也可以快速的創建 Chain。
#### Chain heads
Chain 的屬性由該群組的第一個 View 上的屬性所控制(第一個 View 被稱之為 Chain head).

水平群組,最左邊的 View 為 head, 垂直群組最上面的 View 為 head。
#### Margins in chains
可以為 Chain 中的每個子 View 單獨設置 Margin。對于 spread chains, 可用的布局空白空間是扣除 margin 后的空間。下面會詳細解釋。
#### Chain Style
下面幾個屬性是控制 Chain Style 的:
– layout_constraintHorizontal_chainStyle
– layout_constraintHorizontal_weight
– layout_constraintVertical_chainStyle
– layout_constraintVertical_weight
chainStyle 是設置到 Chain Head 上的,指定不同的 style 會改變里面所有 View 的布局方式,有如下四種 Style:
* CHAIN_SPREAD 這個是默認的 Style, 里面的所有 View 會分散開布局
* Weighted chain,在 CHAIN_SPREAD 模式下,如果有些 View 的尺寸設置為 MATCH_CONSTRAINT(0dp),則這些 View 尺寸會占據所有剩余可用的空間,和 LinearLayout weight 類似。
* CHAIN_SPREAD_INSIDE 和 CHAIN_SPREAD 類似,只不過兩端的兩個 View 和 父容器直接不占用多余空間,多余空間在 子 View 之間分散
* CHAIN_PACKED 這種模式下,所有的子 View 都 居中聚集在一起,但是可以設置 bias 屬性來控制聚集的位置。
下面是幾種模式示意圖:

如果多個子View尺寸設置為 MATCH_CONSTRAINT(0dp),則這些 View 會平均的占用多余的空間。通過 layout_constraintXXX_weight 屬性,可以控制每個 View 所占用的多余空間的比例。例如,對于只有兩個 View 的一個水平 Chain,如果每個View 的寬度都設置為 MATCH_CONSTRAINT, 第一個 View 的 weight 為 2;第二個 View 的 weight 為 1,則第一個 View 所占用的空間是 第二個 View 的兩倍。
### 八、UI 編輯器所使用的屬性
下面幾個屬性是 UI 編輯器所使用的,用了輔助拖拽布局的,在實際使用過程中,可以不用關心這些屬性。
* layout_optimizationLevel
* layout_editor_absoluteX
* layout_editor_absoluteY
* layout_constraintBaseline_creator
* layout_constraintTop_creator
* layout_constraintRight_creator
* layout_constraintLeft_creator
* layout_constraintBottom_creator
## Guideline
Guideline 是 ConstraintLayout 中一個特殊的輔助布局的類。相當于一個不可見的 View,使用 ConstraintLayout 可以創建水平或者垂直的參考線,其他的 View 可以相對于這個參考線來布局。
* 垂直 Guideline 的寬度為 0, 高度為 父容器(ConstraintLayout)的高度
* 水平 Guideline 的高度為 0, 寬度為 父容器(ConstraintLayout)的寬度
參考線的位置是可以移動的。
* layout_constraintGuide_begin 可以指定距離左(或者上)邊開始的固定位置
* layout_constraintGuide_end 可以指定距離右(或者下)邊開始的固定位置
* layout_constraintGuide_percent 可以指定位于布局中所在的百分比,比如距離左邊 2% 的位置
下面是一個使用垂直 Guideline 的示例, Button 相對于 guideline 布局:
~~~xml
android.support.constraint.ConstraintLayout
????????xmlns:android="http://schemas.android.com/apk/res/android"
????????xmlns:app="http://schemas.android.com/apk/res-auto"
????????xmlns:tools="http://schemas.android.com/tools"
????????android:layout_width="match_parent"
????????android:layout_height="match_parent">
????android.support.constraint.Guideline
????????????android:layout_width="wrap_content"
????????????android:layout_height="wrap_content"
????????????android:id="@+id/guideline"
????????????app:layout_constraintGuide_begin="100dp"
????????????android:orientation="vertical"/>
????Button
????????????android:text="Button"
????????????android:layout_width="wrap_content"
????????????android:layout_height="wrap_content"
????????????android:id="@+id/button"
????????????app:layout_constraintLeft_toLeftOf="@+id/guideline"
????????????android:layout_marginTop="16dp"
????????????app:layout_constraintTop_toTopOf="parent" />
/android.support.constraint.ConstraintLayout>
~~~
上面就是 ConstraintLayout 所有布局屬性文件了,看完后是不是感覺 ConstraintLayout 也非常簡單吧。只不過被 RelativeLayout 復雜那么一點點而已。
## 通過代碼來設置 ConstraintLayout 屬性
上面只是 XML 布局文件中使用的屬性,只能在 XML 布局文件中使用,但是現在針對 UI 做動畫的時候,需要通過代碼來動態設置 View 的布局屬性。下面就來看看如何通過代碼來設置這些屬性。
### ConstraintSet
[ConstraintSet](https://developer.android.com/reference/android/support/constraint/ConstraintSet.html)?是用來通過代碼管理布局屬性的集合對象,可以通過這個類來創建各種布局約束,然后把創建好的布局約束應用到一個 ConstraintLayout 上,可以通過如下幾種方式來創建 ConstraintSet:
* 手工創建:
c = new ConstraintSet(); c.connect(….);
* 從 R.layout.* 對象獲取
c.clone(context, R.layout.layout1);
* 從 ConstraintLayout 中獲取
c.clone(clayout);
然后通過 applyTo 函數來應用到ConstraintLayout 上
~~~xml
mConstraintSet.applyTo(mConstraintLayout); // set new constraints
~~~
ConstraintSet 支持所有屬性設置,每個函數如何使用請參考 API 文檔,這里就不再介紹了。
Guideline 也有幾個函數可以設置其位置。
本文出自 云在千峰,轉載時請注明出處及相應鏈接。
本文永久鏈接: http://blog.chengyunfeng.com/?p=1030
---
在[前面一篇文章](http://blog.chengyunfeng.com/?p=1030)中我們介紹了?[ConstraintLayout](https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html)?布局的相關屬性。由于 ConstraintLayout 屬性眾多,如果還是直接在 XML 布局文件中手工編寫布局代碼則無疑寫代碼的效率會很低,為了方便大家更快捷的編寫 UI 布局代碼,Android Studio 中的布局編輯器功能越來越強大,布局編輯器配合 ConstraintLayout 無疑會讓你寫代碼的效率提高很多。 下面來看看布局編輯器有哪些功能。
## 布局編輯器功能介紹
下圖為布局編輯器 UI:

注意上圖是基于 Android Studio 2.2 的截圖,在新的 2.3版本中布局有稍微變化,個別圖標也不一樣。
布局編輯器主要有 5 個功能區域:
1\. Palette 顯示了可用的 View 和 Layout,可以直接把這些控件拖動到布局編輯器中
2\. Component Tree 線上當前布局編輯器中的布局層級結構,在這里點擊一個 View 在編輯器中就會選中這個 View。
3\. Toolbar 布局編輯器的功能選項,
4\. Design Editor 布局編輯器主窗口,線上當前的布局效果,有兩種線上模式,Design 和 Blueprint
5\. Properties 可以修改當前選中的 View 的各種屬性
當打開布局 xml 文件的時候,默認情況下會打開 Design 編輯器,如果你想直接修改 XML 代碼則可以點擊下面的 Text tab 來切換。
在 Text 編輯模式下,點擊右邊的 Preview 也同樣可以查看預覽效果:

### 工具欄介紹
下面是 Design 編輯器的工具欄:

工具欄第一行為通用功能,前面三個為Design 和 blueprint 預覽模式切換,后面幾個分別介紹如下:
1\. Design 和 blueprint 預覽模式切換,可以只顯示一種或者兩種同時顯示
2\. 屏幕方向切換
3\. 設備類型和屏幕尺寸切換,可以直接預覽當前 UI 在不同屏幕設備上顯示的效果
4\. API 版本可以選擇預覽 UI 布局的系統版本
5\. App 主題可以選擇要使用的主題。 注意:這個功能只能使用支持的布局樣式,很多主題是不能直接在這里使用的。
6\. 切換語言,還可以點擊 Edit Translations 選項直接編輯多語言資源
7\. 創建其他種類的布局,比如當前有個適用于豎屏的布局,你可以通過這個按鈕來創建一個新的應用于橫屏的布局
工具欄第二行為 ConstraintLayout 特有的工具欄,后面會介紹。
## 把現有布局轉換為 ConstraintLayout
這是一個貼心功能,可以直接把現有的其他布局一鍵轉換為 ConstraintLayout:
1\. 在 Android Studio 中打開布局文件,在 Design 編輯模式下
2\. 點擊右下角的 Component Tree 窗口,選中需要轉換的布局,然后右鍵點擊 “Convert layout to ConstraintLayout” 選項即可
## 設置 ConstraintLayout 約束
當把一個 View 拖動到布局編輯器中的時候,點擊選中這個 View 的狀態如下:

上面顯示了控制 View 各種約束的控制手柄:
* Resize Handle ,在 View 四個角的四個方塊手柄為控制 View 尺寸大小的手柄,可以拖動調整 View 尺寸
* Side Constraint Handle, 在 View 四邊上的四個圓形手柄為控制 View 位置的,拖動一個手柄可以指定該邊所相對布局的位置。
* Baseline Constraint Handle 是在 View 中間的一個長條裝的圓角長方形,這個是指定 View baseline 相對布局位置的
例如下圖,把 Button2 的左邊圓形手柄拖動指向 Button1 的右邊圓形手柄,同時設置直接的間距為 56dp,則表示 Button2 的左邊位于 Button1 的右邊,Button2 左邊的 margin 為 56dp:

## 修改 View 屬性
由于很多屬性在布局編輯器主設計窗口中無法直接修改,如果需要修改一個 View 的屬性,可以選中這個 View,然后在 Properties 窗口中修改,

點擊 Properties 工具欄最左邊的兩個箭頭的圖標,可以顯示所有可以修改的屬性。
## ConstraintLayout 布局工具欄
當編輯 ConstraintLayout 的時候,在 編輯器工具欄下方還有一些 ConstraintLayout 特有的工具選項:

這些選項從左到右分別為:
– 是否顯示所有 View 的約束,如果選中則當鼠標放在布局編輯器的時候,可以看到所有 View 之間的約束
– 是否打開 autoconnect 功能,如果打開這個功能,則拖動添加新的 View 的可以,布局編輯器可以自動的在控件所停留的位置添加對應的約束
– 刪除所有 View 上的約束
– 推理沒添加的約束,點擊這個按鈕可以為哪些沒有添加約束的 view 自動更加當前布局的位置添加一個合適的約束規則
– 修改默認 view 之間的 margin
– 設置 View 的尺寸縮放類型
– 設置 View 的對齊方式
– 最后一個為添加 垂直和水平 Guideline 的功能
合理使用這些功能,可以讓你更高效率的編寫 UI 代碼。
本文出自 云在千峰,轉載時請注明出處及相應鏈接。
本文永久鏈接: http://blog.chengyunfeng.com/?p=1031
- 0-發現
- AndroidInterview-Q-A
- Android能讓你少走彎路的干貨整理
- LearningNotes
- temp
- temp11
- 部分地址
- 0-待辦任務
- 待補充列表
- 0-未分類
- AndroidView事件分發與滑動沖突處理
- Spannable
- 事件分發機制詳解
- 1-Java
- 1-Java-01基礎
- 未歸檔
- 你應該知道的JDK知識
- 集合框架
- 1-Java-04合集
- Java之旅0
- Java之旅
- JAVA之旅01
- JAVA之旅02
- JAVA之旅03
- JAVA之旅04
- JAVA之旅05
- JAVA之旅06
- JAVA之旅07
- JAVA之旅08
- JAVA之旅09
- java之旅1
- JAVA之旅10
- JAVA之旅11
- JAVA之旅12
- JAVA之旅13
- JAVA之旅14
- JAVA之旅15
- JAVA之旅16
- JAVA之旅17
- JAVA之旅18
- JAVA之旅19
- java之旅2
- JAVA之旅20
- JAVA之旅21
- JAVA之旅22
- JAVA之旅23
- JAVA之旅24
- JAVA之旅25
- JAVA之旅26
- JAVA之旅27
- JAVA之旅28
- JAVA之旅29
- java之旅3
- JAVA之旅30
- JAVA之旅31
- JAVA之旅32
- JAVA之旅33
- JAVA之旅34
- JAVA之旅35
- 1-Java-05辨析
- HashMapArrayMap
- Java8新特性
- Java8接口默認方法
- 圖解HashMap(1)
- 圖解HashMap(2)
- 2-Android
- 2-Android-1-基礎
- View繪制流程
- 事件分發
- AndroidView的事件分發機制和滑動沖突解決
- 自定義View基礎
- 1-安卓自定義View基礎-坐標系
- 2-安卓自定義View基礎-角度弧度
- 3-安卓自定義View基礎-顏色
- 自定義View進階
- 1-安卓自定義View進階-分類和流程
- 10-安卓自定義View進階-Matrix詳解
- 11-安卓自定義View進階-MatrixCamera
- 12-安卓自定義View進階-事件分發機制原理
- 13-安卓自定義View進階-事件分發機制詳解
- 14-安卓自定義View進階-MotionEvent詳解
- 15-安卓自定義View進階-特殊形狀控件事件處理方案
- 16-安卓自定義View進階-多點觸控詳解
- 17-安卓自定義View進階-手勢檢測GestureDetector
- 2-安卓自定義View進階-繪制基本圖形
- 3-安卓自定義View進階-畫布操作
- 4-安卓自定義View進階-圖片文字
- 5-安卓自定義View進階-Path基本操作
- 6-安卓自定義View進階-貝塞爾曲線
- 7-安卓自定義View進階-Path完結篇偽
- 8-安卓自定義View進階-Path玩出花樣PathMeasure
- 9-安卓自定義View進階-Matrix原理
- 通用類介紹
- Application
- 2-Android-2-使用
- 2-Android-02控件
- ViewGroup
- ConstraintLayout
- CoordinatorLayout
- 2-Android-03三方使用
- Dagger2
- Dagger2圖文完全教程
- Dagger2最清晰的使用教程
- Dagger2讓你愛不釋手-終結篇
- Dagger2讓你愛不釋手-重點概念講解、融合篇
- dagger2讓你愛不釋手:基礎依賴注入框架篇
- 閱讀筆記
- Glide
- Google推薦的圖片加載庫Glide:最新版使用指南(含新特性)
- rxjava
- 這可能是最好的RxJava2.x入門教程完結版
- 這可能是最好的RxJava2.x入門教程(一)
- 這可能是最好的RxJava2.x入門教程(三)
- 這可能是最好的RxJava2.x入門教程(二)
- 這可能是最好的RxJava2.x入門教程(五)
- 這可能是最好的RxJava2.x入門教程(四)
- 2-Android-3-優化
- 優化概況
- 各種優化
- Android端秒開優化
- apk大小優化
- 內存分析
- 混淆
- 2-Android-4-工具
- adb命令
- 一鍵分析Android的BugReport
- 版本控制
- git
- git章節簡述
- 2-Android-5-源碼
- HandlerThread 源碼分析
- IntentService的使用和源碼分析
- 2-Android-9-辨析
- LRU算法
- 什么是Bitmap
- 常見圖片壓縮方式
- 3-Kotlin
- Kotlin使用筆記1-草稿
- Kotlin使用筆記2
- kotlin特性草稿
- Kotlin草稿-Delegation
- Kotlin草稿-Field
- Kotlin草稿-object
- 4-JavaScript
- 5-Python
- 6-Other
- Git
- Gradle
- Android中ProGuard配置和總結
- gradle使用筆記
- Nexus私服搭建
- 編譯提速最佳實踐
- 7-設計模式與架構
- 組件化
- 組件化探索(OKR)
- 1-參考列表
- 2-1-組件化概述
- 2-2-gradle配置
- 2-3-代碼編寫
- 2-4-常見問題
- 2-9-值得一讀
- 8-數據結構與算法
- 0臨時文件
- 漢諾塔
- 8-數據-1數據結構
- HashMap
- HashMap、Hashtable、HashSet 和 ConcurrentHashMap 的比較
- 遲到一年HashMap解讀
- 8-數據-2算法
- 1個就夠了
- Java常用排序算法(必須掌握的8大排序算法)
- 常用排序算法總結(性能+代碼)
- 必須知道的八大種排序算法(java實現)
- 9-職業
- 閱讀
- 書單
- 面試
- 面試-01-java
- Java面試題全集駱昊(上)
- Java面試題全集駱昊(下)
- Java面試題全集駱昊(中)
- 面試-02-android
- 40道Android面試題
- 面試-03-開源源碼
- Android圖片加載框架最全解析(二),從源碼的角度理解Glide的執行流程
- 面試-07-設計模式
- 面試-08-算法
- 面試-09-其他
- SUMMARY
- 版權說明
- temp111