ConstraintLayout

　　ConstraintLayout 是目前 Android Studio 在產生 Activity 時使用的預設版面，Constraint 的中文翻譯是限制、條件、約束，由劍橋英語字典對它的解釋為「something that controls what you do by keeping you within particular limits」，意思是一些讓你能夠控制的東西。假如我們想要一個元件依照我們的意思配置在版面中的特定位置，就應該為它加上一些控制條件，而這些限制條件就稱為 Constraints 約束值。

　　一個無任何 Constraint 的元件，它預設會配置在 layout 的最左上角 (x:0, y:0) 處，如果一個畫面中有多個元件都未設定任何 Constraint 時，它們全都會擠在畫面的左上角。

　　在 Android Studio 自動為 Bmi 專案產生的 activity_main.xml 就是一個完整的 ConstraintLayout 版面配置，在正中間有一個文字方塊 TextView 元件，用來顯示字串資料 "Hello World"。請在 Component Tree 中點擊選取該 TextView，並觀察它目前的狀態，如下圖：

　　圖中 TextView 元件擁有分別是上、下、左與右四 Contraints，它會水平置中是因為左與右兩個 Contraints，會垂直置中是因為上、下兩個 Constraints 的原因。請讀者將游標移至元件上方的 Constraint 圓點上，如下圖：

在此時，請按住 Ctrl 鍵，該 Constraint 點會變成紅色，如下圖：

　　只要按一下它（滑鼠左鍵），這個 Constraint 就立即被刪除，當我們刪除上方的 Constraint 後，因為垂直方向只剩一個下方 的 Constraint 了，所以它就跑到 ConstraintLayout 的最下方，如下圖：

　　當我們再把右邊的 Constraint 也刪除後，TextView 元件只擁有左與下這兩個 Constraints，因此它的位置就跑到整個版面的左下角，如下圖：

　　請再刪除下方的約束值，此時會出現錯誤，如下圖：

　　在 ConstraintLayout 中的每一個元件必須擁有一個水平與垂直方向的約束 Contraint，如果違反此規定，在 Layout 的原始 XML 碼中會出現錯誤訊息，如下：

　　上圖的錯誤就是因為 TextView 只有一個向左的 Constraint，缺了一個垂直方向 ( 上或下 ) 的 Constraint。

　　假設想讓這個 TextView 放在版面的左上方，應該為它設定左與上兩個 Constraint，請按下元件上方的 Constraint 並往上拖拉到版面的最上緣，結果如下圖：

　　在右方的屬性區的最上面也有元件的 Constraint 示意圖，可以調整每個 Constraint 的間距 (Margin) 如下圖：

　　Constraint 的對象不只是 Layout 本身，也可以是畫面中的某個元件，這部份會在本章後續的練習中介紹。 

練習影片