ConstraintLayout是属于Android Studio 2.2的新特性,现在使用As构建默认的Activity,其对应的页面根布局已由RelativeLayout替换成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=".ViewTouchActivity">
....
</android.support.constraint.ConstraintLayout>
ConstraintLayout虽然非常适合使用可视化的方式来编写界面,但个人认为要想懂得其原理的话,还是建议使用XML的方式来进行编写。ConstraintLayout还有一个优点,它可以有效地解决布局嵌套过多的问题。平时编写界面,复杂的布局总会伴随着多层的嵌套,而嵌套越多,程序的性能也就越差。ConstraintLayout则是使用约束的方式来指定各个控件的位置和关系的,它有点类似于RelativeLayout,但远比RelativeLayout要更强大。
下面看看官网的介绍(官方文档):
ConstraintLayout
public class ConstraintLayout
extends ViewGroup
java.lang.Object
↳ android.view.View
↳ android.view.ViewGroup
↳ android.support.constraint.ConstraintLayout
Known direct subclasses
MotionLayout
A ConstraintLayout is a ViewGroup which allows you to position and size widgets in a flexible way.
Note: ConstraintLayout is available as a support library that you can use on Android systems starting with API level 9 (Gingerbread). As such, we are planning on enriching its API and capabilities over time. This documentation will reflect those changes.
There are currently various types of constraints that you can use:
Relative positioning
Margins
Centering positioning
Circular positioning
Virtual Helpers objects
Optimizer
Note that you cannot have a circular dependency in constraints.
Also see ConstraintLayout.LayoutParams for layout attributes
相对定位
图1 - 相对定位示例
一般概念是将某个控件的约定约束到任何其空间的另一侧。
例如,为了将按钮B定位在按钮A的右侧(图1):
需要这样做:
<Button android:id="@+id/buttonA" ... />
<Button android:id="@+id/buttonB" ...
app:layout_constraintLeft_toRightOf="@+id/buttonA" />
图2 - 相对定位约束
快速理解:被约束控件的上|下|左|右 约束到指定控件的上|下|左|右
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
layout_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf
它们都引用id另一个小部件,或者parent引用父容器,即ConstraintLayout:
<Button android:id="@+id/buttonB" ...
app:layout_constraintLeft_toLeftOf="parent" />
边距
图3 - 相对定位边距
如果设置了边距,则它们将应用于相应的约束(如果存在)(图3),将边距强制为目标和源边之间的空间。通常的布局边距属性可用于此效果:
android:layout_marginStart
请注意,保证金只能是正数或等于零,并且需要a Dimension。
android:layout_marginEnd
android:layout_marginLeft
android:layout_marginTop
android:layout_marginRight
android:layout_marginBottom
连接到GONE小部件时的边距
当位置约束目标的可见性为View.GONE,您还可以使用以下属性指示要使用的不同边距值:
layout_goneMarginStart
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginTop
layout_goneMarginRight
layout_goneMarginBottom
居中定位与偏压
居中定位
<android.support.constraint.ConstraintLayout ...>
<Button android:id="@+id/button" ...
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent/>
</>
Bias
<android.support.constraint.ConstraintLayout ...>
<Button android:id="@+id/button" ...
app:layout_constraintHorizontal_bias="0.3"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent/>
</>
边界线
Guideline 布局时需要用到作为边界、基准线,页面上是不可见的。
<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.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
app:layout_constraintGuide_begin="100dp"
android:orientation="vertical"/>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
android:layout_marginTop="16dp"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
其他情况可参考
官方文档
ConstraintLayout 完全解析 快来优化你的布局