一、前言:
Android里的ConstraintLayout是个非常强大的工具,它有效的解决了Android里Layout的层级嵌套的问题。使用一个ConstraintLayout可以实现之前多个Layout才能实现的效果。
本篇文章就介绍下ConstraintLayout里比较进阶用法之一:Barrier。
二、Barrier介绍:
Barrier和Guideline 一样,都是自己不可见,只是用来定位的控件。
假如我们要实现这样一种效果,控件C以控件A和B的最右边缘对齐。如下图:
图片.png1、不用Barrier的实现方法
因为A和B的宽度是动态变化的,所以控件C不能简单的依赖于具体的A或B的右边缘,只能把A和B放到一个ViewGroup里面,然后控件C依赖于这个新的ViewGroup的右边缘。
如下图:
图片.png
这样实现虽然可以解决问题,但是却引入了一层嵌套。而使用Barrier则可以不用嵌套就能实现这样的效果。
2、使用Barrier的解决方案:
注意:使用下面这两个属性:
app:barrierDirection="end"
app:constraint_referenced_ids="btn_a,btn_b"
首先,我们先定义控件A和B:
<Button
android:id="@+id/btn_a"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginTop="200dp"
android:layout_marginLeft="30dp"
android:text="这是控件A,我比较宽"/>
<Button
android:id="@+id/btn_b"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="@id/btn_a"
app:layout_constraintTop_toBottomOf="@id/btn_a"
android:layout_marginTop="30dp"
android:text="这是控件B"/>
然后,定义一个Barrier:
<android.support.constraint.Barrier
android:id="@+id/barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="btn_a,btn_b"/>
其中,app:constraint_referenced_ids="btn_a,btn_b"
这句指定这个Barrier是用来控制id为btn_a和btn_b的两个控件。而app:barrierDirection="end"
这句等于在这两个控件的右端设置一道“屏障”。
最后,我们让控件C依赖于这个Barrier。注意这句:app:layout_constraintLeft_toLeftOf="@id/barrier"
效果如下图,注意中间那条竖线在App运行的时候是看不到的。
图片.png我们可以动态调整下控件A和B的宽度,发现控件C始终保持与A和B的最右端依赖。
图片.png以上就是Barrier的使用方法简介,希望对你有所帮助!
网友评论