ConstraintLayout–使用初始部分

介紹

ConstraintLayout作為一款可以靈活調整view位置和大小的Viewgroup被Google瘋狂推薦，以前建立布局，預設根元素都是LinearLayout,現在是ConstraintLayout了。ConstraintLayout能夠以支援庫的形式最小支援到API 9，同時也在不斷的豐富ConstraintLayout的API和功能。ConstraintLayout在複雜布局中能夠有效的，降低布局的層級，提高性能，使用更加靈活。

其實主要的就是了解屬性問題啊 了解一下就比較好的進行布局了

layout_constraintLeft_toLeftOf  我的左側與你的左側對齊
layout_constraintLeft_toRightOf  我的左側與你的右側對齊
layout_constraintRight_toLeftOf 我的右側與你的左側對齊
layout_constraintRight_toRightOf 我的右側與你的右側對齊
layout_constraintTop_toTopOf 我的頂部與你的頂部對齊
layout_constraintTop_toBottomOf 我的頂部與你的底部對齊 (相當于我在你下面)
layout_constraintBottom_toTopOf 
layout_constraintBottom_toBottomOf
layout_constraintBaseline_toBaselineOf 基線對齊
layout_constraintStart_toEndOf 我的左側與你的右側對齊
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf
           

現在的預設布局都是這個了依賴自己看着辦

在app元件的Graldle預設都有如下依賴：

//可能版本不一樣哦
implementation 'com.android.support.constraint:constraint-layout:1.1.3
           

使用

先上圖檔

這是基礎的布局可以多加練習進行整理和熟悉

下面的就是代碼

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

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/top_left"
            android:text="左上"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"/>

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/top_cen"
            android:text="上中"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            tools:ignore="MissingConstraints"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/top_right"
            android:text="右上"
            app:layout_constraintEnd_toEndOf="parent"
            tools:ignore="MissingConstraints"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_left_cen"
            android:text="左中"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            tools:ignore="MissingConstraints"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_left"
            android:text="中左"
            app:layout_constraintRight_toLeftOf="@+id/main_btn_one"
            app:layout_constraintBottom_toBottomOf="@+id/main_btn_one"
    />

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_top"
            android:text="中上"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintRight_toLeftOf="@+id/main_btn_one"
            app:layout_constraintBottom_toTopOf="@+id/main_btn_one"

    />

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/main_btn_one"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:text="居中"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_right"
            android:text="中右"
            app:layout_constraintLeft_toRightOf="@+id/main_btn_one"
            app:layout_constraintBottom_toBottomOf="@+id/main_btn_one"
    />

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_botm"
            android:text="中下"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/main_btn_one"

    />


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/centered_right_cen"
            android:text="右中"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            tools:ignore="MissingConstraints"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/bottom_left"
            android:text="左下"
            app:layout_constraintBottom_toBottomOf="parent"
            tools:ignore="MissingConstraints"/>

    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/bottom_cen"
            android:text="下中"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"/>


    <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/bottom_right"
            android:text="右下"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            tools:ignore="MissingConstraints"/>


</androidx.constraintlayout.widget.ConstraintLayout>
           

個人問題就沒有詳細的整理部落格可以根據位置文字自己查對應的代碼