Android-ConstraintLayout约束布局

ConstraintLayout谷歌官方文档
推荐文章《约束布局ConstraintLayout看这一篇就够了》
从Android Studio2.3起，官方的模版默认使用ConstraintLayout

使用方法

添加依赖

在app/build。gradle文件中添加依赖
implementation 'com.android.support.constraint:constraint-layout:1.1.3'

定位方式

相对定位

相对定位意思就是相对于另外一个控件的位置，类似于relativelayout

属性	功能
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	Baseline指的是文本基线 如果两个button高度不同 使用此属性可以以文本内容为基线 对齐控件
layout_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf

角度定位

用一个角度和一个距离来约束两个空间的中心

角度定位主要是使用一下三个属性设置
CircleAngle 设置角度
CircleRadius 设置长度

app:layout_constraintCircle="@id/button1"
app:layout_constraintCircleAngle="60"
app:layout_constraintCircleRadius="140dp"

Margin属性

常用margin和传统类似需要注意的是goneMargin

goneMargin主要用于约束的控件可见性被设置为gone的时候，margin的属性才开始生效

属性	功能
layout_goneMarginStart	功如其名
layout_goneMarginEnd	功如其名
layout_goneMarginLeft	功如其名
layout_goneMarginTop	功如其名
layout_goneMarginRight	功如其名
layout_goneMarginBottom	功如其名

居中

app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"

尺寸约束

• 指定尺寸
• 使用wrap_content
  有系统自动计算
• 使用0dp
  官方不推荐在ConstraintLayout中使用match_parent
  

    <Button
        android:id="@+id/button1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="button       1"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        android:background="@color/colorAccent"
        android:textColor="#fff"
        android:padding="20dp"
        />

        android:layout_width="0dp"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"

通过这样的方式，会自动拉伸控件

• 使用宽高比

  app:layout_constraintDimensionRatio="6:6"

  

链

链在单个轴（水平或垂直）中提供类似ROW的行为

如果一组小部件通过双向连接链接在一起，就可以被视为链

链表

**使用链表的相关知识可以替代线性布局的权重问题 **

使用
layout_constraintHorizontal_chainStyle改变整条链的样式

属性值	说明
spread	默认值 展开元素
spread inside	展开元素 但是两边的元素 贴近parent
packet	所有元素贴近在中心
weighted Chain	带权值展开

weighted Chain

step1:需要将链中控件的每个控件的layout_width设置为0dp
step2:
使用一下属性设置权值

  app:layout_constraintVertical_weight=""
        app:layout_constraintHorizontal_weight=""