CoordinatorLayout的使用如此簡單

我的CSDN博客同步發(fā)布:CoordinatorLayout的使用如此簡單

曾在網(wǎng)上找了一些關(guān)于CoordinatorLayout的教程斟湃,大部分文章都是把CoordinatorLayoutAppbarLayoutCollapsingToolbarLayout 以及Toolbar等一起使用來介紹活尊,這讓我不知不覺在心中認(rèn)為把這幾個布局要一起使用,而且只是用于那種場景中陨闹。其實CoordinatorLayout的功能并不是局限于與AppBarLayout一起使用扑浸,它的功能強(qiáng)大著呢,本文主要對CoordinatorLayout的使用進(jìn)行介紹梁丘,后面再寫一篇文章將AppBarLayoutCollapsingToolBarLayout整合CoordinatorLayout一起侵浸。那么到底CoordinatorLayout有多好用,請往下感受吧~

CoordinatorLayout能做什么

在學(xué)習(xí)CoordinatorLayout之前氛谜,很有必要了解CoordinatorLayout能幫我們做什么掏觉,從名字上可以看出,就是幫我們協(xié)調(diào)子View的值漫。怎么個協(xié)調(diào)法呢?就是它根據(jù)我們的定制澳腹,幫助我們協(xié)調(diào)各個子View的布局。我們先看一組動畫圖~

CoordinatorLayout演示

CoordinatorLayout演示截圖

稍微解釋一下這個動畫杨何,藍(lán)色的矩形是我們一個普通View酱塔,黃色的Hello是一個Button。我們水平拖動藍(lán)色矩形時危虱,黃色Button沿著與藍(lán)色矩形相反方向移動羊娃;豎直移動藍(lán)色矩形時,黃色也跟著豎直槽地。簡而言之:它們在豎直方向同步移動迁沫,在水平方向相反。

這個效果如果讓你不用CoordinatorLayout去實現(xiàn)捌蚊,應(yīng)該沒有任何問題集畅,但是代碼的耦合度應(yīng)該非常大,你的代碼必須要持有2個View的引用缅糟,然后在onTouchEvent里面做各種判斷挺智。如果我們想要實現(xiàn)的功能是,有更多的View要根據(jù)藍(lán)色的View的移動相應(yīng)作出響應(yīng)窗宦,那么那就得在藍(lán)色ViewonTounchEvent里面針對其他的View處理各種邏輯赦颇。這耦合度未免太傷感了~

CoordinatorLayout既然號稱能幫我們協(xié)調(diào)子View的布局,我們接下來看看CoordinatorLayout如何實現(xiàn)~

CoordinatorLayout使用

CoordinatorLayout的使用核心是Behavior赴涵,Behavior就是執(zhí)行你定制的動作媒怯。在講Behavior之前必須先理解兩個概念:ChildDependency,什么意思呢髓窜?Child當(dāng)然是子View的意思了扇苞,是誰的子View呢欺殿,當(dāng)然是CoordinatorLayout的子View;其實Child是指要執(zhí)行動作的CoordinatorLayout的子View鳖敷。而Dependency是指Child依賴的View脖苏。比如上面的gif圖中,藍(lán)色的View就是Dependency定踱,黃色的View就是Child棍潘,因為黃色的View的動作是依賴于藍(lán)色的View。簡而言之崖媚,就是如過Dependency這個View發(fā)生了變化亦歉,那么Child這個View就要相應(yīng)發(fā)生變化。發(fā)生變化是具體發(fā)生什么變化呢至扰?這里就要引入Behavior鳍徽,Child發(fā)生變化的具體執(zhí)行的代碼都是放在Behavior這個類里面。

怎么使用Behavior呢敢课,首先,我們定義一個類绷杜,繼承CoordinatorLayout.Behavior<T>,其中直秆,泛型參數(shù)T是我們要執(zhí)行動作的View類,也就是Child鞭盟。然后就是去實現(xiàn)Behavior的兩個方法:

/**
* 判斷child的布局是否依賴dependency
*/
   @Override
 public boolean layoutDependsOn(CoordinatorLayout parent, T child, View dependency) {
    boolean rs;
    //根據(jù)邏輯判斷rs的取值
    //返回false表示child不依賴dependency圾结,ture表示依賴
    return rs;  
}

/**
* 當(dāng)dependency發(fā)生改變時(位置、寬高等)齿诉,執(zhí)行這個函數(shù)
* 返回true表示child的位置或者是寬高要發(fā)生改變筝野,否則就返回false
*/
@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, T child, View dependency) {
     //child要執(zhí)行的具體動作
        return true;
}

有了上面的概念后,我們看看具體怎么去實現(xiàn)吧~

為了響應(yīng)跟隨手指移動的操作粤剧,我們定義一個非常簡單的View歇竟,這個View只響應(yīng)跟隨手指移動,將這個View作為Dependency抵恋。由于過于簡單焕议,這個View源碼不粘貼,我們只需知道這個View的類名叫:TempView弧关。

我們看看Behavior的使用:

package com.hc.studycoordinatelayout;

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.studycoordinatelayout
 * 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位置發(fā)生變化,都會執(zhí)行onDependentViewChanged方法
    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, Button btn, View dependency) {
        
        //根據(jù)dependency的位置世囊,設(shè)置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别瞭,現(xiàn)在我們?yōu)?code>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.studycoordinatelayout.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.studycoordinatelayout.MyBehavior" />

    <com.hc.studycoordinatelayout.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>

是不是很簡單呢?我們只需關(guān)注Behavior的編寫就好了籽慢,把ChildDependency之間的關(guān)系完全解耦了~

附上源碼地址:http://download.csdn.net/detail/huachao1001/9537636

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末浸遗,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子箱亿,更是在濱河造成了極大的恐慌跛锌,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,378評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件届惋,死亡現(xiàn)場離奇詭異髓帽,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)脑豹,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評論 2 382
  • 文/潘曉璐 我一進(jìn)店門郑藏,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人瘩欺,你說我怎么就攤上這事必盖。” “怎么了俱饿?”我有些...
    開封第一講書人閱讀 152,702評論 0 342
  • 文/不壞的土叔 我叫張陵歌粥,是天一觀的道長。 經(jīng)常有香客問我拍埠,道長失驶,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,259評論 1 279
  • 正文 為了忘掉前任枣购,我火速辦了婚禮嬉探,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘棉圈。我一直安慰自己涩堤,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,263評論 5 371
  • 文/花漫 我一把揭開白布迄损。 她就那樣靜靜地躺著定躏,像睡著了一般。 火紅的嫁衣襯著肌膚如雪芹敌。 梳的紋絲不亂的頭發(fā)上痊远,一...
    開封第一講書人閱讀 49,036評論 1 285
  • 那天,我揣著相機(jī)與錄音氏捞,去河邊找鬼碧聪。 笑死,一個胖子當(dāng)著我的面吹牛液茎,可吹牛的內(nèi)容都是我干的逞姿。 我是一名探鬼主播辞嗡,決...
    沈念sama閱讀 38,349評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼滞造!你這毒婦竟也來了续室?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,979評論 0 259
  • 序言:老撾萬榮一對情侶失蹤谒养,失蹤者是張志新(化名)和其女友劉穎挺狰,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體买窟,經(jīng)...
    沈念sama閱讀 43,469評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡丰泊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,938評論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了始绍。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片瞳购。...
    茶點(diǎn)故事閱讀 38,059評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖亏推,靈堂內(nèi)的尸體忽然破棺而出学赛,到底是詐尸還是另有隱情,我是刑警寧澤吞杭,帶...
    沈念sama閱讀 33,703評論 4 323
  • 正文 年R本政府宣布罢屈,位于F島的核電站,受9級特大地震影響篇亭,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜锄贷,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,257評論 3 307
  • 文/蒙蒙 一译蒂、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧谊却,春花似錦柔昼、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至碴萧,卻和暖如春乙嘀,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背破喻。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工虎谢, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人曹质。 一個月前我還...
    沈念sama閱讀 45,501評論 2 354
  • 正文 我出身青樓婴噩,卻偏偏與公主長得像擎场,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子几莽,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,792評論 2 345

推薦閱讀更多精彩內(nèi)容