約束佈局ConstraintLayout加快佈局速度

Android Studio2.2更新佈局設計器，同時，引人了約束佈局ConstraintLayout。

簡單來講，能夠把它看作是相對佈局的升級版本，可是區別與相對佈局更增強調約束。何爲約束，即控件之間的關係。

它能讓你的佈局更加扁平化，通常來講一個界面一層就夠了；同時藉助於AS咱們能極其簡單的完成界面佈局。

ConstraintLayout簡介​

ConstraintLayout的優勢很是突出。

ConstraintLayout不須要使用嵌套佈局就可讓咱們去構建一個大而複雜的佈局， 他與RelativeLayout很類似，全部在裏面的View的佈局方式取決於View與View之間的關係和父佈局。可是他比RelativeLayout 更靈活，而且在Android Studio’s Layout Editor中能夠很容易的去使用。

ConstraintLayout的全部工做均可以使用佈局編輯器的可視化工具中完成，由於佈局API和佈局編輯器對此專門構建的。所以你能夠徹底經過拖拽的方式去構建一個使用了ConstraintLayout 的佈局，而不用直接在XML中編輯。

參考下圖：

這個界面主要分紅下面幾個部分：

• 左側邊欄，包括Palette組件庫和Component Tree
• 中間是佈局設計器，包括兩部分，左邊是視圖預覽，右邊是佈局約束
• 右側邊欄，上面是相似盒子模型的邊界和大小布局設計器，下面是屬性列表。

簡單介紹完了約束佈局的特點和開發界面，接下來來看看如何使用約束佈局。

添加約束佈局

使用約束佈局，必須確保你擁有最新的約束佈局的庫。

1. 點擊Tools > Android > SDK Manager

2. 點擊SDK Tools Tab

3. 展開Support Repository，而後勾選ConstraintLayout for Android 和Solver for ConstraintLayout。勾選Show Package Details，注意你下載的版本。

4. 點擊OK

添加ConstraintLayout庫到你的build.gradle文件中，目前最新版本是beta4

dependencies {
  //...
  compile 'com.android.support.constraint:constraint-layout:1.0.0-beta4'
}

你下載的這個庫的版本可能會更高，確保與你以前下載的版本匹配便可。

使用約束佈局

新建的項目，自動生成的佈局默認不會使用ConstraintLayout，可是Android Studio提供了便捷的方式，能夠直接轉換成ConstraintLayout。

1. 打開你的佈局文件，切換到Design tab

2. 在Component Tree窗體中，右擊佈局文件，而後點擊Convert layout to ConstraintLayout（以下圖）。

固然，
也能夠新建一個新的約束佈局。
新建一個佈局文件

輸入佈局文件的名字，將佈局的根元素改成
android.support.constraint.ConstraintLayout

最後點擊完成

添加約束

拖一個View到佈局編輯器中。當你添加了一個View到ConstraintLayout中，他的四個角對應着的四個小矩形框是控制大小的，每一條邊有四個圓形的約束控制點。

這裏主要包含幾種類型的約束

1. 尺寸大小
2. 邊界約束
3. 基準線約束
4. 約束到一個引導線（輔助線）

尺寸大小

尺寸約束使用的是『實心方塊』，如圖：

這個很好理解，就是調整組件的大小。

你可使用View每一個角的控制點去調整其大小，可是這樣作只是把寬高寫死，這樣作不能適應不一樣的內容和不一樣的屏幕大小，咱們應該避免這樣去使用。爲了選擇一個動態的大小模式或者定義一個更具體的尺寸，請單擊並打開編輯器右側的Properties窗口，以下圖。

灰色的矩形區域，表明選擇的View，矩形的的符號表明寬和高。

• (>>>)Wrap Content：View的大小與其內容適配

• (有點像彈簧的圖標)Any Size：View大小恰好匹配其對應的約束，他的實際值是0dp，表示這個View沒有指望的尺寸，可是他渲染後的大小將會匹配其約束。

• (直線)Fixed：View的大小的是固定的

點擊符號便可在上面三種模式中互相切換。

注意：你不該該在ConstraintLayout中使用match_parent，而是使用0dp

邊界約束

邊界約束使用的是『空心圓圈』，如圖：

邊界約束，是使用最多的約束，它用於創建組件與組件之間、組件與Parent邊界之間的約束關係，實際上，就是肯定彼此的相對位置。

單擊View選中，而後單擊並按住一個約束控制點拖拽這條線到一個可用的錨點（其餘View、Layout的邊緣或者引導線），當你鬆開，這個約束將會被建立，兩個View也將被默認的margin隔開。

爲了確保左右的View都被均衡的隔開，點擊工具欄的Margin 去爲新添加進佈局的View選擇一個默認的margin值。

Button將會顯示你當前選擇的值，你作的更改將應用於以後你新添加的View。
你也能夠經過點擊Properties面板線上的數字去更改margin的值。

工具中提供的margin值全是8的倍數，幫助你的View與Material Design的推薦的8dp的方形網格保持一致

基準線約束

基準線約束，使用的是『空心圓角矩形』，如圖：

基準線約束，是讓兩個帶有文本屬性的組件進行對齊的，可讓兩個組件的文本按照基準線進行對齊。惟一要注意的是，你須要把鼠標放在控件上，等基準線約束的圖形亮了，才能夠進行拖動。

約束到一個引導線（輔助線）

你能夠添加一個水平和垂直方向上的引導線，這能夠當作你的附加約束。你在佈局內能夠定位這個引導線，dp和百分比做爲單位都可。

想要建立這個引導線，在工具欄點擊Guidelines（以下圖），而後點擊Add Vertical Guidelineo或者Add Horizontal Guideline便可。

拖動引導線中間的圓便可定位引導線的位置。

當你建立一個約束的時候，必定要記得下面幾點規則：

1. 每個View必須有兩個約束：一個水平的，一個垂直的。

2. 只有約束控制點和另一個錨點在同一平面才能建立約束（也就是說將要建立的約束的View和錨點View屬於同一級）。所以一個View的垂直平面（左側和右側）只能被另外一個的垂直平面約束，基線只能被其餘基線約束。

3. 一個約束控制點，只能被用來建立一次約束，可是能夠在同一錨點建立多個約束（來自不一樣的View）

若是你想要刪除一個約束，先選舉中View，而後點擊須要刪除的約束控制點便可。

使用自動鏈接和約束推斷

自動鏈接(Autoconnect) 爲添加進佈局的View自動建立兩個或者多個約束，Autoconnect 默認被禁用，你能夠經過點擊編輯器工具欄中的Turn on Autoconnect（一個有點像磁鐵的圖片）開啓他。

當你開啓了Autoconnect，當你添加新的View到佈局以後Autoconnect就會自動建立約束，他不會爲已經存在的View建立約束。若是你拖動View一次，約束就值將會改變，可是以前的約束自己不會被改變。因此若是你想從新去定位View，那麼你必須刪除以前的約束。

或者，你能夠點擊Infer Constraints（一個有點像電燈的圖標）去爲佈局中全部的View建立約束

Infer Constraints掃描整個佈局爲全部的View決定一套最有效的約束，所以他能夠建立兩個距離很遠的View之間的約束。然而Autoconnect，只能爲新添加進佈局的View建立約束，而且他建立的約束僅僅只能是距離最近的元素。在這兩種狀況下，你能夠隨時經過點擊約束控制點去刪除約束而後建立新的約束去修改他。

快速對齊Align

工具欄中有個對齊圖標，能夠點擊按鈕直接讓多個控件對齊。

最後，上面一些操做還能夠經過右鍵點擊控件找到。

---

更多精彩請關注微信公衆帳號likeDev