ConstraintLayout初探

前言

升级到AS2.3以后用AS新建project时Activity的默认布局变成了ConstraintLayout,谷歌在推广ConstraintLayout的力度上着实不小,之前2.2Preview刚出来的时候ConstraintLayout作为一个新特性被推出,那时候稍微研究了一下,觉得限制还是很多的,拖控件的方式在实际项目中使用起来时也没有看上去那么方便,就没有太关注,但这次AS2.3将ConstraintLayout作为了默认布局,说明ConstraintLayout确实有让谷歌认可的独到之处,就决定花点时间认真研究一下,本文是基于谷歌官方对于ConstraintLayout的说明文档而写成。

ConstraintLayout简介

ConstraintLayout使用平面视图层次结构(无嵌套视图组)创建大而复杂的布局,它和RelativeLayout很像,都是通过确定和同级View以及父布局之间的关系来确定自己的位置和大小,但是ConstraintLayout比RelativeLayout更加灵活,并且可以通过AS的布局编辑器来进行编辑。

在ConstraintLayout确定View的位置

想要确定View的位置,必须给View至少添加两个约束,水平和垂直方向上各一个,这个约束可以是相对于相邻的View的,也可以是相对于父布局的,没有添加约束的那个方向上的坐标值为0(即使在编辑器中拖到固定位置,实际程序运行呈现依然是坐标为0)。

给项目添加ConstraintLayout依赖

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

将存在的layout转换为ConstraintLayout

To convert an existing layout to a constraint layout, follow these steps:

  1. Open your layout in Android Studio and click the Design tab at the bottom of the editor window.
  2. In the Component Tree window, right-click the layout and click Convert layout to ConstraintLayout.

添加约束

在View的边界上会出现一个圆圈,用鼠标选中后拖动到你想与之创建约束的边界上,松开鼠标后约束就自动形成了。
创建约束的时候,要注意以下规则:

  1. 每个View至少有两个约束
  2. 只能在同一个方向上创建约束
  3. 每个 constraint handle 只能创建一个约束,但是同一个锚点可以用于多个约束。

移除约束

选中View后用鼠标单击 constraint handle 或者通过按钮移除所有约束。

约束的类型

Parent position

和父布局之间的约束

Order position

和其他View之间的约束

Alignment

两个View之间的对齐

Baseline alignment

两个TextView之间文字的对齐

Constrain to a guideline

创建一个水平或垂直方向的 guideline 并与之建立约束

总结

关于 ConstraintLayout 的研究就到这里,如果想了解关于 ConstraintLayout 的更详细地使用方法,可以移步谷歌官方文档,这里不一一介绍,总体而言,ConstraintLayout 的上手有一定难度,初期的使用肯定会不习惯,对于习惯了直接用XML来制作的界面的开发者来说这种直接拖拽控件的方式没有足够灵活,如果想在实际项目中使用还需要经过一段时间的适应和摸索(而且在笔者所用的 4.4 上并不支持 app:layout_constraintLeft_toRightOf 属性),但是相较于 Relativelayout 能够看出一定的改进,安卓的界面绘制尤其是复杂界面一直是一件耗时费力的工作,谷歌试图通过 ConstraintLayout 来改变这一现状,至于实际效果如何,笔者将继续观望,并且在后面的实践过程中分享一些经验。

推荐阅读更多精彩内容