欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解Android ConstraintLayout 約束布局的用法

 更新時(shí)間:2018年02月02日 11:10:10   作者:趙彥軍  
本篇文章主要介紹了詳解Android ConstraintLayout 約束布局的用法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

前言

在2016年的Google I/O大會(huì)上 , Google 發(fā)布了Android Studio 2.2預(yù)覽版,同時(shí)也發(fā)布了Android 新的布局方案 ConstraintLayout , 但是最近的一年也沒(méi)有大規(guī)模的使用。2017年Google發(fā)布了 Android Studio 2.3 正式版,在 Android Studio 2.3 版本中新建的Module中默認(rèn)的布局就是 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 引入支持庫(kù):

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

傳統(tǒng)的Android開發(fā)當(dāng)中,界面基本都是靠編寫XML代碼完成的,雖然Android Studio也支持可視化的方式來(lái)編寫界面,但是操作起來(lái)并不方便,我也一直都不推薦使用可視化的方式來(lái)編寫Android應(yīng)用程序的界面。

而ConstraintLayout就是為了解決這一現(xiàn)狀而出現(xiàn)的。它和傳統(tǒng)編寫界面的方式恰恰相反,ConstraintLayout非常適合使用可視化的方式來(lái)編寫界面,但并不太適合使用XML的方式來(lái)進(jìn)行編寫。當(dāng)然,可視化操作的背后仍然還是使用的XML代碼來(lái)實(shí)現(xiàn)的,只不過(guò)這些代碼是由Android Studio根據(jù)我們的操作自動(dòng)生成的。

另外,ConstraintLayout 還有一個(gè)優(yōu)點(diǎn),它可以有效地解決布局嵌套過(guò)多的問(wèn)題。我們平時(shí)編寫界面,復(fù)雜的布局總會(huì)伴隨著多層的嵌套,而嵌套越多,程序的性能也就越差。ConstraintLayout則是使用約束的方式來(lái)指定各個(gè)控件的位置和關(guān)系的,它有點(diǎn)類似于 RelativeLayout,但遠(yuǎn)比RelativeLayout要更強(qiáng)大。

ConstraintLayout向下兼容 API 9

關(guān)于 ConstraintLayout 的基本使用方法請(qǐng)參照郭神的博客:http://www.dbjr.com.cn/article/126440.htm

這篇文章說(shuō)一些其他的特性。

常用方法總結(jié)

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

constraintDimensionRatio

這個(gè)屬性就是把一個(gè)View的尺寸設(shè)為特定的寬高比,比如設(shè)置一張圖片的寬高比為 1:1,4:3, 16:9 等。通過(guò)使用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>

效果圖如下:

這里寫圖片描述

偏移比例

當(dāng)我們的布局文件是下面這樣的時(shí)候:

<?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>

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

這里寫圖片描述

那么我們有個(gè)疑問(wèn),為什么Button 是居中顯示的?因?yàn)樵谏厦娴牟季种杏袃蓚€(gè)重要的屬性沒(méi)有寫出來(lái),但是卻有默認(rèn)的屬性值,那就是水平、垂直的偏移比例。

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

如果在布局文件中沒(méi)有明確的寫出偏移比例,那么系統(tǒng)默認(rèn)偏移比例值為:0.5 。

到這里我們已經(jīng)清楚了,上面的布局文件就相當(dāng)于:

<?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>

我們可以試試,更改Button 的偏移值試試看,比如,水平偏移0.3 , 垂直偏移0.7 , 看看效果:

這里寫圖片描述

可以看到很明顯,Button 在水平方向向右偏移比例為 30% , 在垂直方向向下偏移比例為 70% 。

基線約束控鍵

該控鍵幫助你對(duì)齊任意兩個(gè)widget的文字部分,與widget的大小無(wú)關(guān)。例如你有兩個(gè)不同尺寸的widget但是你想要他們的文字部分對(duì)齊。

layout_constraintBaseline_toBaselineOf

這里寫圖片描述

這里寫圖片描述

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論