前段時間發現Android Studio在新建 Activity 的時候，預設生成的佈局檔案的根佈局變成了 ConstraintLayout ，不過由於以前的幾種佈局檔案都是用習慣了，所以往往都是直接修改根佈局，最近覺得有必要學習一下這種佈局的使用，畢竟 google 都推薦使用，所以就把我瞭解到的一些東西分享一下，希望可以幫助到對 ConstraintLayout 感興趣的朋友~

Android Studio 預設生成的佈局檔案如下：

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity"
    tools:layout_editor_absoluteY
 
="89dp">

</android.support.constraint.ConstraintLayout>

簡單的理解，ConstraintLayout 佈局的使用方法就是給其中的子檢視新增一系列約束，從而使自檢視展示在螢幕的特定位置。
對於要新增的每一個約束我們可以簡單的理解為有一個橡皮筋在拉著我們的檢視，從而使檢視展現在某個位置。
我們先向其中新增一個TextView 試一試，推薦使用 圖形佈局工具 來對ConstraintLayout 進行佈局以及修改，因為這樣比較直觀方便。
新增一個TextView之後的佈局檔案如下：

<?xml version="1.0" encoding="utf-8"?>
 

<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"
    tools:context="com.tobetheonlyone.startandroid.MainActivity"
    tools:layout_editor_absoluteY="89dp">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="title"/>
</android.support.constraint.ConstraintLayout>

由程式碼可以看出我們除了修改了 id ，其他什麼都沒有新增，即未新增任何約束，執行後 TextView 顯示在左上角，現在我們新增一個約束試一試~
如下圖，點選檢視樹中的 TextView，然後滑鼠移到預覽介面的 TextView 中會出現四個圓圈，這四個圓圈分別是用來建立四個方向的約束的，點選右邊的原點：

然後向右拖動到右邊界，這樣就建立了右邊的約束，TextView 自動就跑到了檢視的右邊，如下圖：

同樣的，如果對一個檢視只新增向下的約束，那麼檢視就會顯示在螢幕的底部，其他的也同理。如果我們把 TextView 上下左右都新增約束，那麼 TextView 會顯示在螢幕中間，效果如下：

此時再看我們的佈局檔案如下:

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.tobetheonlyone.startandroid.MainActivity"
    tools:layout_editor_absoluteY="89dp">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:text="title"
        android:textColor="@android:color/black"
        android:textSize="35sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"</android.support.constraint.ConstraintLayout>

這時候，TextView 多了一些屬性，margin 之類的屬性在其他佈局中都用到過，就不多做闡述，主要是最後四行程式碼：

        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"

這是我們以前不曾用過的，這四個屬性都是以 layout_ 開頭。凡是以layout_ 開頭的屬性都屬於佈局引數。與其他屬性不同的是，元件的佈局引數 都是用於告訴父佈局如何安排自己，我們也已經用過許多這樣的屬性，如layout_width 和 layout_height。
約束的名字分別是 constraintBottom，constraintEnd，constraintStart，constraintTop，分別代表TextView 的底部約束，右邊的約束，左邊的約束和頂部約束。
最後，屬性以 to...of="parent" 作為結束，表示約束是連線到父元件，即ConstraintLayout 中的。

PS:開發了一個製作個性二維碼的應用，有興趣的朋友可以試一試~ 創意二維碼製作