CoordinatorLayout的使用如此简单(Android)
曾在网上找了一些关于coordinatorlayout的教程,大部分文章都是把coordinatorlayout、appbarlayout、collapsingtoolbarlayout 以及toolbar等一起使用来介绍,这让我不知不觉在心中认为把这几个布局要一起使用,而且只是用于那种场景中。其实coordinatorlayout的功能并不是局限于与appbarlayout一起使用,它的功能强大着呢,本文主要对coordinatorlayout的使用进行介绍,后面再写一篇文章将appbarlayout和collapsingtoolbarlayout整合coordinatorlayout一起。那么到底coordinatorlayout有多好用,请往下感受吧~
coordinatorlayout能做什么
在学习coordinatorlayout之前,很有必要了解coordinatorlayout能帮我们做什么,从名字上可以看出,就是帮我们协调子view的。怎么个协调法呢?就是它根据我们的定制,帮助我们协调各个子view的布局。我们先看一组动画图~
稍微解释一下这个动画,蓝色的矩形是我们一个普通view,黄色的hello是一个button。我们水平拖动蓝色矩形时,黄色button查着与蓝色矩形相反方向移动;竖直移动蓝色矩形时,黄色也跟着竖直。简而言之:它们在竖直方向同步移动,在水平方向相反。
这个效果如果让你不用coordinatorlayout去实现,应该没有任何问题,但是代码的耦合度应该非常大,你的代码必须要持有2个view的引用,然后在ontouchevent里面做各种判断。如果我们想要实现的功能是,有更多的view要根据蓝色的view的移动相应作出响应,那么那就得在蓝色view的ontounchevent里面针对其他的view处理各种逻辑。这耦合度未免太伤感了~
而coordinatorlayout既然号称能帮我们协调子view的布局,我们接下来看看coordinatorlayout如何实现~
coordinatorlayout使用
coordinatorlayout的使用核心是behavior,behavior就是执行你定制的动作。在讲behavior之前必须先理解两个概念:child和dependency,什么意思呢?child当然是子view的意思了,是谁的子view呢,当然是coordinatorlayout的子view;其实child是指要执行动作的coordinatorlayout的子view。而dependency是指child依赖的view。比如上面的gif图中,蓝色的view就是dependency,黄色的view就是child,因为黄色的view的动作是依赖于蓝色的view。简而言之,就是如过dependency这个view发生了变化,那么child这个view就要相应发生变化。发生变化是具体发生什么变化呢?这里就要引入behavior,child发生变化的具体执行的代码都是放在behavior这个类里面。
怎么使用behavior呢,首先,我们定义一个类,继承coordinatorlayout.behavior<t>,其中,泛型参数t是我们要执行动作的view类,也就是child。然后就是去实现behavior的两个方法:
/** * 判断child的布局是否依赖dependency */ @override public boolean layoutdependson(coordinatorlayout parent, t child, view dependency) { boolean rs; //根据逻辑判断rs的取值 //返回false表示child不依赖dependency,ture表示依赖 return rs; } /** * 当dependency发生改变时(位置、宽高等),执行这个函数 * 返回true表示child的位置或者是宽高要发生改变,否则就返回false */ @override public boolean ondependentviewchanged(coordinatorlayout parent, t child, view dependency) { //child要执行的具体动作 return true; }
有了上面的概念后,我们看看具体怎么去实现吧~
为了响应跟随手指移动的操作,我们定义一个非常简单的view,这个view只响应跟随手指移动,将这个view作为dependency。由于过于简单,这个view源码不粘贴,我们只需知道这个view的类名叫:tempview。
我们看看behavior的使用:
package com.hc.studycoordinatorlayout; import android.content.context; import android.support.design.widget.coordinatorlayout; import android.util.attributeset; import android.util.displaymetrics; import android.view.view; import android.widget.button; /** * package com.hc.studycoordinatorlayout * created by huachao on 2016/6/1. */ public class mybehavior extends coordinatorlayout.behavior<button> { private int width; public mybehavior(context context, attributeset attrs) { super(context, attrs); displaymetrics display = context.getresources().getdisplaymetrics(); width = display.widthpixels; } @override public boolean layoutdependson(coordinatorlayout parent, button child, view dependency) { //如果dependency是tempview的实例,说明它就是我们所需要的dependency return dependency instanceof tempview; } //每次dependency位置发生变化,都会执行ondependentviewchanged方法 @override public boolean ondependentviewchanged(coordinatorlayout parent, button btn, view dependency) { //根据dependency的位置,设置button的位置 int top = dependency.gettop(); int left = dependency.getleft(); int x = width - left - btn.getwidth(); int y = top; setposition(btn, x, y); return true; } private void setposition(view v, int x, int y) { coordinatorlayout.marginlayoutparams layoutparams = (coordinatorlayout.marginlayoutparams) v.getlayoutparams(); layoutparams.leftmargin = x; layoutparams.topmargin = y; v.setlayoutparams(layoutparams); } }
ok,现在我们为button类指定了dependency,并且定义好了跟随dependency一直变化的动作(behavior),接下来我们就要指定好为哪个具体的button实例来绑定这些。方法很简单,直接在布局文件指定就好:
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.coordinatorlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.hc.studycoordinatorlayout.mainactivity"> <button android:id="@+id/btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginleft="300dp" android:layout_margintop="300dp" android:background="#ffcc00" android:text="hello" app:layout_behavior="com.hc.studycoordinatorlayout.mybehavior" /> <com.hc.studycoordinatorlayout.tempview android:layout_width="100dp" android:layout_height="100dp" android:layout_marginleft="300dp" android:layout_margintop="300dp" android:background="#3366cc" /> </android.support.design.widget.coordinatorlayout>
是不是很简单呢?我们只需关注behavior的编写就好了,把child和dependency之间的关系完全解耦了~
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。