ConstraintLayout佈局的使用總結

本文根據本人學習和使用記錄的內容。
ConstraintLayout,比較牛逼的一種佈局,結合了其他幾種佈局的優點,也可以看做RelativeLayout的升級版。
使用ConstraintLayout需要引入:

implementation 'com.android.support.constraint:constraint-layout:1.1.3'

首先很重要也是很基礎的幾個屬性

app:layout_constraintTop_toTopOf="@id/id2"
app:layout_constraintTop_toBottomOf="@id/id2"
app:layout_constraintLeft_toLeftOf="@id/id2"
app:layout_constraintLeft_toRightOf="@id/id2"
app:layout_constraintRight_toLeftOf="@id/id2"
app:layout_constraintRight_toRightOf="@id/id2"
app:layout_constraintBottom_toTopOf="@id/id2"
app:layout_constraintBottom_toBottomOf="@id/id2"

這幾個屬性可以這樣理解:
以layout_constraintTop_toTopOf="@id/id2"爲例,此view的top和id2的view的top對齊。
當然也可以設值爲parent(layout_constraintTop_toTopOf=「parent」),意思是與父容器的top對齊。

example:
textview只設置了 app:layout_constraintTop_toTopOf=「parent」。

<TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@android:color/holo_green_light"
        android:gravity="center"
        app:layout_constraintTop_toTopOf="parent"
        android:text="hello world"/>

效果是與父view的top對齊,那效果就和默認的對齊方式一致。
在這裏插入圖片描述
再設置 app:layout_constraintBottom_toBottomOf="parent"底部與父view的bottom對齊

<TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@android:color/holo_green_light"
        android:gravity="center"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:text="hello world"/>

在這裏插入圖片描述
再設置:
app:layout_constraintTop_toTopOf=「parent」
app:layout_constraintBottom_toBottomOf=「parent」
app:layout_constraintLeft_toLeftOf=「parent」
app:layout_constraintRight_toRightOf=「parent」

<TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@android:color/holo_green_light"
        android:gravity="center"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:text="hello world"/>

在這裏插入圖片描述