ConstraintLayout
ConstraintLayout
是一个允许您以灵活的方式定位和调整控件的ViewGroup
。
相对定位
相对定位是在ConstraintLayout中创建布局的基本构建块之一。这些约束允许将给定的控件相对于另一个控件或者父布局(ConstraintLayout自身)进行定位。您可以在水平和垂直轴上约束控件:
- 水平轴:左,右,起点和终点
- 垂直轴:顶部,底部和文本基线
例如,为了将按钮B定位在按钮A的右侧(图1):
图1 - 相对定位示例复制代码
这告诉系统我们希望按钮B的左侧被约束到按钮A的右侧。这样的位置约束意味着系统将尝试让双方共享相同的位置。
相对父布局定位:
复制代码图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
边距
图3 - 相对定位边距如果设置了边距,则它们将应用于相应的约束(如果存在)(图3),将边距强制为目标和源边之间的空间。通常的布局边距属性可用于此效果:
android:layout_marginStart
android:layout_marginEnd
android:layout_marginLeft
android:layout_marginTop
android:layout_marginRight
android:layout_marginBottom
请注意,保证margin只能是正数或等于零。
连接到GONE控件时的边距
当位置约束目标的可见性为View.GONE
,您还可以使用以下属性指示要使用的不同边距值:
layout_goneMarginStart
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginTop
layout_goneMarginRight
layout_goneMarginBottom
中心定位和偏移
一个有用的方面ConstraintLayout
是它如何处理“不可能”的约束。例如,如果我们有类似的东西:
除非ConstraintLayout
恰好具有Button
与之完全相同的大小,否则两个约束不能同时满足(双方都不能成为我们想要它们的地方)。
在这种情况下发生的事情是,约束的作用就像是相反的力量将控件拉平(图4); 这样控件最终将在父容器中居中。这同样适用于垂直约束。
偏移
遇到这种相反的约束时的默认设置是使窗口控件居中; 但是您可以使用偏差属性调整定位以使一侧偏向另一侧:
layout_constraintHorizontal_bias
layout_constraintVertical_bias
例如,以下将使左侧具有30%的偏差而不是默认的50%,使得左侧将更短,控件更倾向于左侧(图5):
使用偏差,您可以制作更好地适应屏幕尺寸变化的用户界面。
圆角定位(1.1中增加)
您可以以一个控件的中心作为圆的圆心,相对于这个控件的角度和半径所在的点作为另一个控件的中心为定位(参见图6)。可以使用以下属性:
layout_constraintCircle
:引用另一个控件IDlayout_constraintCircleRadius
:到其他控件中心的距离layout_constraintCircleAngle
:控件应该处于哪个角度(以度为单位,从0到360)
复制代码
可见性行为
ConstraintLayout
具有标记为控件的特定处理View.GONE
。
GONE
像往常一样,窗口控件不会显示,也不是布局本身的一部分(即如果标记为,它们的实际尺寸将不会更改GONE
)。
但就布局计算而言,GONE
控件仍然是其中的一部分,具有重要的区别:
- 对于布局传递,它们的尺寸将被视为零(基本上,它们将被解析为一个点)
- 如果他们对其他控件有限制,他们仍然会受到尊重,但任何边距都会等于零
这种特定的行为允许构建布局,您可以暂时将窗口控件标记为GONE
,而不会破坏布局(图7),这在进行简单的布局动画时尤其有用。
**注意:**使用的边距将是B在连接到A时定义的边距(例如,参见图7)。在某些情况下,这可能不是您想要的余量(例如A在其容器侧面有100dp的边距,B只有16dp到A,标记A已经消失,B将有16dp的余量到容器)。因此,您可以指定在连接到标记为已消失的窗口控件时要使用的备用边距值(请参阅)。
尺寸限制
ConstraintLayout上的最小尺寸
您可以为ConstraintLayout
自身定义最小和最大尺寸:
android:minWidth
设置布局的最小宽度android:minHeight
设置布局的最小高度android:maxWidth
设置布局的最大宽度android:maxHeight
设置布局的最大高度
当ConstraintLayout的尺寸设置为WRAP_CONTENT时,这些最小和最大尺寸将会生效。
控件尺寸约束
可以通过以3种不同方式设置android:layout_width和 android:layout_height属性来指定控件的维度:
可以通过以3种不同方式设置android:layout_width
和 android:layout_height
属性来指定控件的维度:
- 使用特定尺寸值(文字值,例如
123dp
或Dimension
参考) - 使用
WRAP_CONTENT
,这将要求控件计算自己的大小 - 使用
0dp
,相当于“MATCH_CONSTRAINT
”
前两个以与其他布局类似的方式工作。最后一个将以匹配所设置的约束的方式调整窗口控件的大小(参见图8,(a)是wrap_content,(b)是0dp)。如果设置了边距,则在计算中将考虑它们(图8,(c)中的0dp)。
重要提示: MATCH_PARENT
不建议用于ConstraintLayout
中包含的控件。可以通过使用MATCH_CONSTRAINT
设置为"parent"
相应的左/右或上/下约束来定义类似的行为。
WRAP_CONTENT:强制约束(*在1.1中添加*)
如果将维度设置为WRAP_CONTENT
,则在1.1之前的版本中,它们将被视为文字尺寸 - 这意味着约束不会限制生成的尺寸。虽然通常这足够(并且更快),但在某些情况下,您可能希望使用WRAP_CONTENT
,但仍然强制执行约束以限制生成的尺寸。在这种情况下,您可以添加一个相应的属性:
app:layout_constrainedWidth=”true|false”
app:layout_constrainedHeight=”true|false”
MATCH_CONSTRAINT尺寸(*在1.1中添加*)
当尺寸设置为时MATCH_CONSTRAINT
,默认行为是使结果大小占用所有可用空间。还有几个额外的修饰符:
layout_constraintWidth_min
和layout_constraintHeight_min
:将设置此维度的最小大小layout_constraintWidth_max
和layout_constraintHeight_max
:将设置此维度的最大大小layout_constraintWidth_percent
和layout_constraintHeight_percent
:将此维度的大小设置为相对于父布局的百分比
最小和最大
为min和max指示的值可以是Dp中的尺寸,也可以是“wrap”,它将使用与WRAP_CONTENT相同的值
百分比
要使用百分比,您需要设置以下内容:
- 尺寸应设置为
MATCH_CONSTRAINT
(0dp) - 默认值应设置为百分比
app:layout_constraintWidth_default="percent"
或app:layout_constraintHeight_default="percent"
(**注意:**这在1.1-beta1和1.1-beta2中是必需的,但如果定义了percent属性,则在以下版本中不需要) - 然后将
layout_constraintWidth_percent
或layout_constraintHeight_percent
属性设置为0到1之间的值
比例
您还可以将窗口控件的一个尺寸定义为另一个控件尺寸的比例。为此,您需要将至少一个约束维度设置为0dp
(即MATCH_CONSTRAINT
),并将该属性layout_constraintDimensionRatio
设置为给定比率。例如:
复制代码
将按钮的高度设置为与其宽度相同。
该比率可表示为:
- 浮点值,表示宽度和高度之间的比率
- “宽度:高度”形式的比率
如果两个尺寸都设置为MATCH_CONSTRAINT
(0dp),您也可以使用比例。在这种情况下,系统设置满足所有约束的最大尺寸并保持指定的纵横比。要根据另一个特定边的尺寸限制一个特定边,可以预先附加W,
“或” H,
分别约束宽度或高度。例如,如果一个尺寸受两个目标约束(例如,宽度为0dp且以父节点为中心),则可以指示应该约束哪一边,通过 在比率前添加字母W
(用于约束宽度)或H
(用于约束高度),用逗号分隔:
复制代码
将按照16:9的比例设置按钮的高度,而按钮的宽度将匹配父项的约束。
链
链在单个轴(水平或垂直)上提供类似行的行为。另一个轴可以独立约束。
创建一个链
如果一组控件通过双向连接链接在一起,则它们被视为链(参见图9,显示最小链,具有两个控件)。
图9 - 链链头
链由链的第一个元素(链的“头部”)上设置的属性控制:
图10 - 链头头部是水平链的最左侧控件,垂直链的最顶部控件。
链中的边距
如果在连接上指定了边距,则会考虑它们。在扩散链的情况下,将从分配的空间中扣除保证金。
链式
设置属性layout_constraintHorizontal_chainStyle
或layout_constraintVertical_chainStyle
链的第一个元素时,链的行为将根据指定的样式(默认值CHAIN_SPREAD
)更改。
CHAIN_SPREAD
- 元素将展开(默认样式)- 加权链接
CHAIN_SPREAD
模式,如果设置了一些控件MATCH_CONSTRAINT
,它们将分割可用空间 CHAIN_SPREAD_INSIDE
- 类似,但链的端点不会分散CHAIN_PACKED
- 链条的元素将被包装在一起。然后,子项的水平或垂直偏差属性将影响打包元素的定位
加权链
链的默认行为是在可用空间中平均分布元素。如果使用了一个或多个元素MATCH_CONSTRAINT
,它们将使用可用的空白空间(在它们之间平均分配)。属性layout_constraintHorizontal_weight
和layout_constraintVertical_weight
将控制如何将空间利用的元素之间进行分配MATCH_CONSTRAINT
。例如,在包含两个元素的链上使用MATCH_CONSTRAINT
,第一个元素使用权重2,第二个元素使用权重1,第一个元素占用的空间将是第二个元素占用的空间的两倍。
边距和链条(*1.1*)
在链中的元素上使用边距时,边距是相加的。
例如,在水平链上,如果一个元素定义了10dp的右边距而下一个元素定义了5dp的左边距,则这两个元素之间产生的边距为15dp。
在计算链用于定位项目的剩余空间时,会同时考虑项目及其边距。剩余空间不包含边距。
虚拟助手对象
除了之前详述的内在功能外,您还可以使用特殊的辅助对象ConstraintLayout
来帮助您进行布局。目前,该Guideline
对象允许您创建相对于ConstraintLayout
容器定位的水平和垂直指南。然后可以通过将控件约束到这样的指导来定位控件。在1.1中,Barrier
也Group
被添加了。
优化器(*1.1*)
在1.1中我们暴露了约束优化器。您可以通过将标记app:layout_optimizationLevel添加到ConstraintLayout元素来决定应用哪些优化。
- none:未应用任何优化
- 标准:默认。仅优化直接和障碍约束
- 直接:优化直接约束
- 障碍:优化障碍限制
- 链:优化链约束(实验)
- 维度:优化维度度量(实验),减少匹配约束元素的度量数量
此属性是一个掩码,因此您可以通过列出所需的优化来决定打开或关闭特定的优化。例如:app:layout_optimizationLevel =“direct | barrier | chain”
Barrier
Barrier,直译为障碍、屏障。在约束布局中,可以使用属性constraint_referenced_ids
属性来引用多个带约束的组件,从而将它们看作一个整体,Barrier 的介入可以完成很多其他布局不能完成的功能。barrierDirection
属性指定约束的方向。
图12 - Barrier约束
复制代码
Guideline
GuideLine可以翻译为参考线(约束线或者参照线等)。Guideline 与 LinearLayout 类似可以设置水平或垂直方向,android:orientation="horizontal"
,android:orientation="vertical"
,水平方向高度为0
,垂直方向宽度为0
。Guideline 具有以下的三种定位方式:
- layout_constraintGuide_begin 距离父容器起始位置的距离(左侧或顶部)
- layout_constraintGuide_end 距离父容器结束位置的距离(右侧或底部)
- layout_constraintGuide_percent 距离父容器宽度或高度的百分比
Guideline可以实现和Barrier相同的功能,其他控件以Barrier或者Guideline自身为基准来确定自己的位置。不同点就是仅作为基准线来说,使用Guideline就足够,如果需要基准线位置随控件尺寸变化,这时使用Barrier可以实现这样的功能。
Group
Group控制多个View的可见性,可见性将控制constraint_referenced_ids
指定的控件。
多个组可以引用相同的控件 - 在这种情况下,XML声明顺序将定义最终的可见性状态(最后声明的组将具有最后一个单词)。
复制代码
约束集。主要在Java代码中克隆和应用约束(不做详解)。
ConstraintLayout.LayoutParams,ConstraintProperties,ConstraintsChangedListener不做介绍,请看
ConstraintLayout丰富的属性包含和考虑了多种使用场景,建议大家都使用ConstraintLayout进行Android布局。