如何在Android中使用ConstraintLayout方法約束布局

本篇文章給大家分享的是有關如何在Android中使用ConstraintLayout方法約束布局，小編覺得挺實用的，因此分享給大家學習，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

<?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.constraintlayout.app.Main2Activity">
</android.support.constraint.ConstraintLayout>

在使用 ConstraintLayout 的布局方案，需要在 build.gradle 引入支持庫：

dependencies {
  compile 'com.android.support.constraint:constraint-layout:1.0.1'
}

傳統的Android開發當中，界面基本都是靠編寫XML代碼完成的，雖然Android Studio也支持可視化的方式來編寫界面，但是操作起來并不方便，我也一直都不推薦使用可視化的方式來編寫Android應用程序的界面。

而ConstraintLayout就是為了解決這一現狀而出現的。它和傳統編寫界面的方式恰恰相反，ConstraintLayout非常適合使用可視化的方式來編寫界面，但并不太適合使用XML的方式來進行編寫。當然，可視化操作的背后仍然還是使用的XML代碼來實現的，只不過這些代碼是由Android Studio根據我們的操作自動生成的。

另外，ConstraintLayout 還有一個優點，它可以有效地解決布局嵌套過多的問題。我們平時編寫界面，復雜的布局總會伴隨著多層的嵌套，而嵌套越多，程序的性能也就越差。ConstraintLayout則是使用約束的方式來指定各個控件的位置和關系的，它有點類似于 RelativeLayout，但遠比RelativeLayout要更強大。

ConstraintLayout向下兼容 API 9

關于 ConstraintLayout 的基本使用方法請參照郭神的博客：https://www.jb51.net/article/126440.htm

這篇文章說一些其他的特性。

常用方法總結

layout_constraintTop_toTopOf    // 將所需視圖的頂部與另一個視圖的頂部對齊。 
layout_constraintTop_toBottomOf  // 將所需視圖的頂部與另一個視圖的底部對齊。 
layout_constraintBottom_toTopOf  // 將所需視圖的底部與另一個視圖的頂部對齊。 
layout_constraintBottom_toBottomOf // 將所需視圖的底部與另一個視圖的底部對齊。 
layout_constraintLeft_toTopOf   // 將所需視圖的左側與另一個視圖的頂部對齊。 
layout_constraintLeft_toBottomOf  // 將所需視圖的左側與另一個視圖的底部對齊。 
layout_constraintLeft_toLeftOf   // 將所需視圖的左邊與另一個視圖的左邊對齊。 
layout_constraintLeft_toRightOf  // 將所需視圖的左邊與另一個視圖的右邊對齊。 
layout_constraintRight_toTopOf   // 將所需視圖的右對齊到另一個視圖的頂部。
layout_constraintRight_toBottomOf // 將所需視圖的右對齊到另一個的底部。
layout_constraintRight_toLeftOf  // 將所需視圖的右邊與另一個視圖的左邊對齊。
layout_constraintRight_toRightOf  // 將所需視圖的右邊與另一個視圖的右邊對齊。

constraintDimensionRatio

這個屬性就是把一個View的尺寸設為特定的寬高比，比如設置一張圖片的寬高比為 1：1，4：3， 16：9 等。通過使用ConstraintLayout，只需使用layout_constraintDimensionRatio屬性即可。

<?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"
  android:id="@+id/constraintLayout"
  tools:context="com.constraintlayout.app.MainActivity"
  >

  <ImageView
    android:id="@+id/cat_image"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintDimensionRatio="4:3"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintHorizontal_bias="0"
    android:src="@mipmap/cat"
    />

  <ImageView
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:src="@mipmap/ic_launcher"
    app:layout_constraintDimensionRatio="4:3"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/cat_image"
    app:layout_constraintVertical_bias="0.0"
    app:layout_constraintRight_toRightOf="parent" />
</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: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"
  android:id="@+id/constraintLayout"
  tools:context="com.constraintlayout.app.MainActivity"
  >

  <Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    />
</android.support.constraint.ConstraintLayout>

我們得到的布局效果如下：

那么我們有個疑問，為什么Button 是居中顯示的？因為在上面的布局中有兩個重要的屬性沒有寫出來，但是卻有默認的屬性值，那就是水平、垂直的偏移比例。

layout_constraintHorizontal_bias //控件的水平偏移比例
layout_constraintVertical_bias  //控件的垂直偏移比例

如果在布局文件中沒有明確的寫出偏移比例，那么系統默認偏移比例值為：0.5 。

到這里我們已經清楚了，上面的布局文件就相當于：

<?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"
  android:id="@+id/constraintLayout"
  tools:context="com.constraintlayout.app.MainActivity"
  >

  <Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintVertical_bias="0.5"
    />
</android.support.constraint.ConstraintLayout>

基線約束控鍵

該控鍵幫助你對齊任意兩個widget的文字部分，與widget的大小無關。例如你有兩個不同尺寸的widget但是你想要他們的文字部分對齊。

layout_constraintBaseline_toBaselineOf

以上就是如何在Android中使用ConstraintLayout方法約束布局，小編相信有部分知識點可能是我們日常工作會見到或用到的。希望你能通過這篇文章學到更多知識。更多詳情敬請關注億速云行業資訊頻道。