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=".activity.view.ConstraintLayoutActivity">

</android.support.constraint.ConstraintLayout>

<android.support.constraint.ConstraintLayout>标签，ConstraintLayout是Android Studio 2.2中主要的新增功能之一，所以自动生成的布局文件不再用以前的布局标签。ConstraintLayout翻译为 约束布局，也有人把它称作 增强型的相对布局，由 2016 年 Google I/O 推出。扁平式的布局方式，无任何嵌套，减少布局的层级，优化渲染性能。从支持力度而言，将成为主流布局样式，完全代替其他布局。集万千宠爱于一身的小公举，完全兼容约束集 LinearLayout（线性布局）和RelativeLayout（相对布局）。

ConsrintLayout(约束布局)能够灵活的定位和调整子View的大小,子View依靠约束关系来确定位置.在一个约束关系中,需要一个Source(源)以及一个Target(目标),Source的位置依赖于Target,可以理解为"通过约束关系,Source与Target链接在了一起Source相当于target 的位置便是固定的

基本属性

ConsraintLayout最基本的属性控制有以下几个,即layout_constrainXXX_toYYYOf格式的属性,即将"View A"的方向XXX置于view B的方向YYY

layout_constraintLeft_toRightOf
//Align the left of the desired view to the right of another. （将所需视图的左侧与另一试图的右侧对齐）

//简单说就是B的左侧位于A的右侧
 <TextView
        android:id="@+id/tv_a"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="文字A"
        android:textColor="@color/colorAccent" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="文字B"
        android:textColor="@color/colorPrimary"
        app:layout_constraintLeft_toRightOf="@id/tv_a" />

image.png

layout_constraintTop_toTopOf  —  Align the top of the desired view to the top of another.(将所需视图的顶部与另一个视图的顶部对齐。 )
layout_constraintTop_toBottomOf  —  Align the top of the desired view to the bottom of another.(将所需视图的顶部与另一视图的底部对齐)
layout_constraintBottom_toTopOf  —  Align the bottom of the desired view to the top of another.(将所需视图的底部与另一视图的顶部对齐)
layout_constraintBottom_toBottomOf  —  Align the bottom of the desired view to the bottom of another.(将所需视图的底部与另一视图的底部对齐)
layout_constraintLeft_toTopOf  —  Align the left of the desired view to the top of another.(将所需视图的左侧与另一视图的顶部对齐)
layout_constraintLeft_toBottomOf  —  Align the left of the desired view to the bottom of another.(将所需视图的左侧与另一视图的顶部对齐)
layout_constraintLeft_toLeftOf  —  Align the left of the desired view to the left of another.(将所需视图的左侧与另一视图的左侧对齐)
layout_constraintLeft_toRightOf  —  Align the left of the desired view to the right of another.(将所需视图的左侧与另一视图的右侧对齐)
layout_constraintRight_toTopOf  —  Align the right of the desired view to the top of another.(将所需视图的右侧与另一视图的顶部对齐)
layout_constraintRight_toBottomOf  —  Align the right of the desired view to the bottom of another.(将所需视图的右侧与另一视图的底部对齐)
layout_constraintRight_toLeftOf  —  Align the right of the desired view to the left of another.(将所需视图的右侧与另一视图的左侧对齐)
layout_constraintRight_toRightOf  —  Align the right of the desired view to the right of another.(将所需视图的右侧与另一视图的右侧对齐)
.......
app:layout_constraintStart_toEndOf(将所需视图的开始位置和另一视图的结束对齐,也就是左侧和右侧对齐)
app:layout_constraintStart_toStartOf(将所需视图的开始位置和另一视图的开始对齐,也就是左侧和左侧对齐)
If desired, attributes supporting start and end are also available in place of left and right alignment.
(将所需视图的开始位置和另一视图的结束对齐,也就是左侧和右侧对齐)这两个属性不常用

试用了一天,不错.好用