定义
ConstraintLayout is a ViewGroup which allows you to position and size widgets in a flexible way
在官文的定义中，ConstraintLayout虽说是约束布局，但却能提供更为灵活的布局方式。基于组件间的约束实现的布局灵活性，是此次ConstraintLayout不同于其他布局的特质与飞跃。
基本内容
1) Relative Positioning
ConstraintLayout集成了RelativeLayout和LinearLayout的布局效果，Relative Positioning是类似RelativeLayout的布局方式。不同组件间可以通过添加垂直方向和水平方向的Constraint，实现定位效果。
丶 垂直方向Constraint
- 可添加属性 : Left , Right, Start, End
丶 水平方向Constraint
- 可添加属性 : Top, Bottom, Baseline
可视化Demo :
- 将鼠标悬浮于上下左右边的中点时，会出现闪烁绿点，拖拽鼠标到指定组件边，从而添加Constraint.
- 当组件添加水平方向的Constraint于父组件时，此组件会处于水平中央位置。
- 添加限制的边，再次将鼠标悬浮于边中点，会出现闪烁红点，点击红点可删除之前添加的Constraint.
- 同理，不同独立组件间可用相同方式添加/删除Constraint.
代码Demo:
- 范式： ... app : layout_constraintX_toYOf = "widgetID/widgetName" ...
将组件的X边添加Constraint到指定组件的Y边
- 可用属性
丶 水平方向
>layout_constraintLeft_toLeftOf >layout_constraintLeft_toRightOf
>layout_constraintRight_toRightOf >layout_constraintRight_toLeftOf
>layout_constraintStart_toStartOf >layout_constraintStart_toEndOf
>layout_constraintEnd_toEndOf >layout_constraintEnd_toStartOf
丶垂直方向
>layout_constraintTop_toTopOf >layout_constraintTop_toBottomOf
>layout_constraintBottom_toBottomOf >layout_constraintBottom_toTopOf
>layout_constraintBaseline_toBaselineOf
- 如上例子水平方向添加限制后，生成代码如下
2) Margins
margin值是用于设置已添加Constraint组件间的空隙。
可视化Demo
- 添加Constraint后，点击组件，右侧属性栏出现，见属性栏上方
上下左右的数字是组件边与另一组件边添加Constraint后的margin值，可在框内点击修改margin值
图x
代码Demo
- 范式：... android:layout_marginX = "..dp" ...
- 可用属性
>layout_marginLeft >layout_marginRight
>layout_marginTop >layout_marginBottom
>layout_marginStart >layout_marginEnd
- 图x(上例)生成的代码如下
3）Bias
Bias，偏移之意，用于设置组件在水平方向和垂直方向说处位置的偏移度。当水平/垂直方向，即组件左右边/上下边均添加Constraint时,默认处于目的组件的水平/垂直中央位置。
可视化Demo:
- 见 2）中图x
- 以水平方向为例，当左右边都添加constraint时，图x-红3处的小圆圈，即是源组件相对于目的组件的相对偏移度。默认为50,即居中。
- 可拖动圆圈修改bias值
图y
代码Demo:
- 范式 ： ... app: layout_constraintX_bias = "0.x" ...
- 可用属性
>layout_constraintHorizontal_bias
>layout_constraintVertical_bias
- 注意
bias值，水平方向是left所占比例，垂直方向是top所占比例 ，0 < bias值 < 1.0
- 图y生成代码如下
4）Demensions Constraints
丶 minWidth, minHeight
设置组件的最小宽高。属性优先级高于，layout_width, layout_height，即当ConstraintLayout会优先满足minWidth, minHeight的属性。
丶 layoutWidth, layoutHeight
>可用精确的dp数设置
>可用wrap_content自动计算
>0dp，效果与match_constraint相同(代码中无法识别match_contraint，与官文有出入，原因未知，但可用match_parent实现填充效果)
Demo 略 ...
5) Ratio
Ratio用于设置组件宽高比例，需注意，Ratio生效的前提是 layout_width，layout_height中有一个设为 0dp，不能为match_parent
代码Demo:
- 范式 ：... app: layout_constraintDimensionRatio = "width : height" ...
- 代码示例，实现组件 宽:高--2:1
简要如上，详见官文
https://developer.android.com/reference/android/support/constraint/ConstraintLayout.html
网友评论