Android界面布局學習-ConstraintLayout

先前學習的Android六大布局基本都是靠編寫XML代碼完成的，較為複雜，而ConstraintLayout是Android Studio 2.2新增特性，适合使用可視化的方式來編寫界面，大多通過拖拽控件的方式進行界面布局，使用限制來指定各個控件的位置和關系，同時Android Studio自動生成XML代碼。

接下來是練習一個簡單注冊頁面：

1）Android Studio2.3之後的版本建立一個項目時，XML預設布局便是ConstraintLayout,若預設不是ConstraintLayout，可将XML布局代碼改為android.support.constraint.ConstraintLayout即可

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

</android.support.constraint.ConstraintLayout>
           

2）從Palette區中選擇3個TextView控件拖入目前Component Tree，也可以直接拖入頁面，并分别編輯Text值為"使用者名"、"密碼"、"确認密碼"

接着拖入一個EditText（Plain Text）作為使用者名輸入框，兩個EditText（Password）作為密碼輸入框

最後拖一個按鈕Button，輕按兩下Button可編輯Text為“注冊”，以上控件位置都可随意調整

結果如下圖：

3）如果這個時候運作，顯示界面中所有控件便會全部重合在一起，結果并非上圖中所示，因為還沒有設定控件和容器的限制，是以Component Tree中控件都打了紅色感歎号。

設定控件限制：

在界面中單擊控件，便會在控件的上下左右各出現一個圓圈，這圓圈就是用來添加限制的，我們可以将限制添加到ConstraintLayout，也可以将限制添加到另一個控件。選擇上下中一側和左右中一側，便可固定控件的位置。

删除控件限制:

将滑鼠懸浮在某個限制的圓圈上，然後該圓圈會變成紅色，這個時候單擊一下就能删除該限制。

添加限制後如下圖（看起來有點亂）：

注：控件打了黃色感歎号讓我突然想起string常量是要寫在strings.xml中，以減低資料的備援，便于修改。是以不要像我這樣直接寫入控件的Text值，一定要養成良好的程式設計習慣。

運作結果：