ConstraintLayout(约束布局)
主要是为了解决布局嵌套过多的问题(布局优化、性能优化根本上的),以灵活的方式定位和调整小部件。从 Android Studio 2.3 起,官方的模板默认使用 ConstraintLayout。
意义
在开发过程中经常能遇到一些复杂的UI,可能会出现布局嵌套过多的问题,嵌套得越多,设备绘制视图所需的时间和计算功耗也就越多。简。因为我们UI的绘制机制是层层绘制的。而且由于viewGourp的嵌套,会导致计算功耗也增加。
常见属性(不做过多介绍,和其他布局的使用方式一样)
android_maxHeight
android_maxWidth
android_minHeight
android_minWidth
layout_marginStart
layout_marginEnd
layout_marginLeft
layout_marginTop
layout_marginRight
layout_marginBottom
常用属性
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_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf
先介绍上述的常用属性,看着是不是跟相对布局非常的像?没错!你确实也差不多可以这么理解它,不过你需要注意的是,这些属性的意义是指:当前View(设置属性的View)的某个属性,在目标View(of)的某个属性那边。
举个栗子:
![](https://img.haomeiwen.com/i5014890/72d408652646f967.png)
![](https://img.haomeiwen.com/i5014890/2935ad05116b1147.png)
这样是不是很好理解。ConstraintLayout还有一些其他的属性。
layout_constraintBaseline_toBaselineOf
解法还是一样的,我的基准线在(of)的基准线上,也就是我和(of)的基准线一致。
![](https://img.haomeiwen.com/i5014890/629190beee5831c8.png)
![](https://img.haomeiwen.com/i5014890/983803826b62b96c.png)
GONE属性(被依赖控件GONE之后的边距属性)
layout_goneMarginBottom
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginRight
layout_goneMarginStart
layout_goneMarginTop
![](https://img.haomeiwen.com/i5014890/c8cef47ff4290f56.png)
![](https://img.haomeiwen.com/i5014890/01d02782a9c1a21c.png)
![](https://img.haomeiwen.com/i5014890/403ef3a8bfce0dc0.png)
bias(偏移)
layout_constraintHorizontal_bias// 水平偏移
layout_constraintVertical_bias// 垂直偏移
在设置控件的居中属性之后,通过偏移属性可以设置让控件更偏向于依赖控件的某一方,偏移设置为0~1之间的值。有点类似线性布局的weight属性
![](https://img.haomeiwen.com/i5014890/a332e8ccf506c18e.png)
![](https://img.haomeiwen.com/i5014890/8f9dacde8d67b74b.png)
尺寸属性:常规layout_width和layout_height的值:Xdp,wrap,match_parent,特殊的0dp时候。以下约束的宽高就生效了。
layout_constraintWidth_default
layout_constraintHeight_default
这2个属性只有在view 设置 android:layout_width="0dp" 和android:layout_height="0dp"时才会生效,它有3个值:
wrap(自适应):宽高不超过父容器。和传统的自适应差不多。
spread(伸展):意思是占用所有的符合约束的空间,在这个模式下使用百分比属性效果一样,百思不得其解。
percent (百分比):设置后以下这2个百分比属性生效,layout_constraintWidth_percent和layout_constraintHeight_percent,值为0~1之间,分别表示宽占父容器的百分比,高占父容器的百分比
![](https://img.haomeiwen.com/i5014890/e364ded5d9b92d98.png)
![](https://img.haomeiwen.com/i5014890/7bca22b10877f875.png)
角度定位(一般用的较少)
![](https://img.haomeiwen.com/i5014890/588a7797fe153950.png)
上面例子中的TextView2用到了3个属性:
app:layout_constraintCircle="@+id/TextView1"
app:layout_constraintCircleAngle="120"(角度)
app:layout_constraintCircleRadius="150dp"(距离)
指的是TextView2的中心在TextView1的中心的120度,距离为150dp,效果如下:
![](https://img.haomeiwen.com/i5014890/29e76ae040cd9703.png)
ConstraintLayout中有3个辅助控件协助我们布局
Guideline(布局辅助线)(也是基准线,基于parent)
可以理解为布局辅助线,用于布局辅助,不在设备上显示。
android:orientation=“vertical/horizontal”:有垂直和水平两个方向,当设置这个属性时
垂直:宽度为0,高度等于父容器
水平:高度为0,宽度等于父容器
有三种放置Guideline的方式:
layout_constraintGuide_begin: 控制 Guideline 距离父容器开始的距离
layout_constraintGuide_end: 控制 Guideline 距离父容器末尾的距离
layout_constraintGuide_percent: 控制 Guideline 在父容器中的位置为百分比
![](https://img.haomeiwen.com/i5014890/678346376d469803.png)
![](https://img.haomeiwen.com/i5014890/043d6947f06f5784.png)
Barrier(屏障)(也是基准线,基于view)
app:barrierDirection:为屏障所在的位置,可设置的值有:bottom、end、left、right、start、top
app:constraint_referenced_ids:为屏障引用的控件,可设置多个(用“,”隔开)
![](https://img.haomeiwen.com/i5014890/612983a6058e94da.png)
![](https://img.haomeiwen.com/i5014890/fa5ba02d0cc1d446.png)
Group(组)
可以把多个控件归为一组,方便隐藏或显示一组控件。
![](https://img.haomeiwen.com/i5014890/22bb0bdc4a25f9f4.png)
让代码更简洁,设置起来更方便。注意,组设置的显示或者隐藏会使组内控件的visible属性设置失效。
Placeholder(占位符)
![](https://img.haomeiwen.com/i5014890/047e2b9980de0cc5.png)
![](https://img.haomeiwen.com/i5014890/e5ad76d896be5e86.png)
使用代码动态改变内容。PS:如果我们使用代码动态改变内容,结合TransitionManager可以做一些有趣的过度动画等。
![](https://img.haomeiwen.com/i5014890/ef444ebb72c7cb78.png)
网友评论