Android ConstraintLayout进阶:Guideline的使用及实例

Android ConstraintLayout进阶:Guideline的使用及实例_第1张图片
ConstraintLayout进阶:Guideline的使用及实例

Android里的ConstraintLayout是个非常强大的工具,它有效的解决了Android里Layout的层级嵌套的问题。使用一个ConstraintLayout可以实现之前多个Layout才能实现的效果。

本篇文章就介绍下ConstraintLayout里比较进阶用法之一:Guideline。

Guideline介绍

Guideline是一种特殊的控件,它在界面上是看不见的(被标记为View.Gone),只是用来做参考线。它一般有水平和垂直两种。

Guideline的定位有两种方法:
1.绝对定位:使用layout_constraintGuide_beginlayout_constraintGuide_end
2.百分比定位:使用layout_constraintGuide_percent

下面以两个实例来说明Guideline的用法。

使用Guideline实现控件对称布局

假如,我们想要实现如下的效果,控件A和控件B,在屏幕上对称显示。


Android ConstraintLayout进阶:Guideline的使用及实例_第2张图片
两个控件在屏幕上对称显示

如果不用ConstraintLayout,至少要嵌套两级的Layout才能实现。而用ConstraintLayout里的Guideline,可以很容易的实现这种效果。

在这个例子里,我们可以先定义一个垂直的Guideline,然后用这行代码layout_constraintGuide_percent="0.5"让Guideline垂直居中:

 

然后以这根Guideline为基准,左右各constraint一个控件,注意这两行代码app:layout_constraintRight_toLeftOf="@id/guide"app:layout_constraintLeft_toRightOf="@id/guide"

    

效果如下图,在App真正运行的时候,中间那根线是看不见的。


Android ConstraintLayout进阶:Guideline的使用及实例_第3张图片
对称效果

使用Guideline实现按百分比定位控件

假如我们要在屏幕上显示一行字,这行字距离屏幕上边缘200dp。这个效果虽然很容易实现,但是,因为现实中安卓手机的屏幕分辨率的差异,不同的手机上显示的效果可能会不同。比如,在屏幕比较长的手机上,感觉下面会比较空。如下图:

Android ConstraintLayout进阶:Guideline的使用及实例_第4张图片
如果按照绝对定位的方法,不同分辨率的手机效果会不同

使用Guideline可以解决这个问题,因为Guideline支持百分比的定位。
首先,新建一个水平Guideline,设置为距离上边缘30%: app:layout_constraintGuide_percent="0.3"


然后控件根据这个Guideline来定位,注意这句app:layout_constraintTop_toBottomOf="@id/guide"


最终的效果是这样的:


Android ConstraintLayout进阶:Guideline的使用及实例_第5张图片
使用百分比的效果

因为使用了百分比来定位,所以能更好的适配不同分辨率。

你可能感兴趣的:(Android ConstraintLayout进阶:Guideline的使用及实例)