coordinatorLayout使用总结篇，看完这篇彻底能够开发5.0的高级特效了

了解相关更多技术，可参考《沉浸式状态栏+ScrollView顶部伸缩+ActionBar渐变》，最近在用coordinatorLayout作一些特效，发现网上有好多人已经走完了坑，借此咱们来总结一把。

一言不合就上个图,仍是动态的 

主要是找了半天,好多人说的都不够详细,并且有好多注意事项没有说明,因此走了好多弯路,这个地方就是解决那些关键疑问的,这些疑问清楚了才能真正掌握它的用法

代码示例(activity的xml代码,只须要xml配置就可实现上面这么炫酷的效果了,是否是超赞呢,后面有分析哦):

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="170dp"
            app:contentScrim="@color/colorAccent"
            app:expandedTitleMarginBottom="100dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:title="我是collapsebar的标题">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="第一个固定(pin)"
                android:textSize="40sp"
                app:layout_collapseMode="pin" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="不设置,跟随滑动"
                android:textSize="40sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:text="视察效果(parallax)"
                android:textSize="40sp"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:layout_width="match_parent"
                android:layout_height="30dp"
                android:layout_gravity="top"
                android:background="#600f"
                app:layout_collapseMode="pin">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="我是toolbar" />
            </android.support.v7.widget.Toolbar>

        </android.support.design.widget.CollapsingToolbarLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="appbar以内,collap以外"
            android:textColor="#0f0" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/n_scroll_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="哈"
                android:textColor="#0f0"
                android:textSize="200sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="哈"
                android:textColor="#0f0"
                android:textSize="200sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="哈"
                android:textColor="#0f0"
                android:textSize="200sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="哈"
                android:textColor="#0f0"
                android:textSize="200sp" />
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

代码分析:

使用注意事项:

1. CoordinatorLayout继承自viewgroup,可是使用相似于framLayout,有层次结构,后面的布局会覆盖在前面的布局之上,但跟behavior属性也有很大关系,的app:layout_behavior属性,只有CoordinatorLayout的直接子布局才能响应,因此不要作徒劳无功的事

2. CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout结合起来才能产生这么神奇的效果,不要想固然的光拿着CoordinatorLayout就要玩出来(刚接触的时候我也有这种想法),累死你

3. AppBarLayout:继承自lineLayout,使用时其余属性随lineLayou,已经响应了CoordinatorLayout的layout_behavior属性,因此他能搞出那么多特效来

4. AppBarLayout的直接子控件能够设置的属性:layout_scrollFlags

• 1.scroll|exitUntilCollapsed若是AppBarLayout的直接子控件设置该属性,该子控件能够滚动,向上滚动NestedScrollView出父布局(通常为CoordinatorLayout)时,会折叠到顶端,向下滚动时NestedScrollView必须滚动到最上面的时候才能拉出该布局 
• 2.scroll|enterAlways:只要向下滚动该布局就会显示出来,只要向上滑动该布局就会向上收缩 
• 3.scroll|enterAlwaysCollapsed:向下滚动NestedScrollView到最底端时该布局才会显示出来 
• 4.若是不设置改属性,则改布局不能滑动

5. CollapsingToolbarLayout,字面意思是折叠的toolbar,它确实是起到折叠做用的,能够把本身的自布局折叠 继承自framLayout,因此它的直接子类能够设置layout_gravity来控制显示的位置,它的直接子布局可使用的属性:app:layout_collapseMode(折叠模式):可取的值以下:

• 1.pin:在滑动过程当中,此自布局会固定在它所在的位置不动,直到CollapsingToolbarLayout所有折叠或者所有展开 
• 2.parallax:视察效果,在滑动过程当中,无论上滑仍是下滑都会有视察效果,不知道什么事视察效果本身看gif图(layout_collapseParallaxMultiplier视差因子 0~1之间取值,当设置了parallax时能够配合这个属性使用,调节本身想要的视差效果) 
• 3.不设置:跟随NestedScrollView的滑动一块儿滑动,NestedScrollView滑动多少距离他就会跟着走多少距离

6. toobar最好是放在CollapsingToolbarLayout,也不是没有其余用法,可是在这套系统中通常只能放在CollapsingToolbarLayout里面,才能达到好的效果,这里toolbar同时设置layout_gravity和app:layout_collapseMode时有一些比较复杂的状况.不一一做介绍,由于通常咱们只会把toolbar放在最上面(不用设置layout_gravity属性,默认的),而且设置app:layout_collapseMode为pin,让他固定在最顶端,有兴趣的本身试试其余状况,

7. 告你一个惊天大幂幂:只要CollapsingToolbarLayout里面包含有toolbar那么CollapsingToolbarLayout的折叠后高度就是toolbar的高度,至关于CollapsingToolbarLayout设置了minHeight属性

8. 再告诉你一个惊天大咪咪:CollapsingToolbarLayout折叠到最顶端时,它就是老大,会处于最上层,包括toolbar在内,全部的布局都会被他盖住,显示不出来.

**9. CollapsingToolbarLayout 本身的属性 说明,不是直接子布局可用的,是本身能够用的属性 

contentScrim折叠后的颜色也是展开时的渐变颜色,效果超赞.**
title标题,若是设置在折叠时会动画的显示到折叠后的部分上面,拉开时会展开,很好玩的 
expandedTitleMargin当title文字展开时文字的margin,固然还有marginTop等属性,脑补吧 
app:collapsedTitleTextAppearance=”@style/Text”折叠时title的样式里面能够定义字体大小颜色等 
app:collapsedTitleTextAppearance=”@style/Text1”折叠时title的样式里面能够定义字体大小颜色等 
固然还有一些,本身试试吧,如今的这些已经彻底够用了**

10. 还有最后一个问题:怎么实现固定表头,这个也简单,写一个布局放在CollapsingToolbarLayout以后,AppBarLayout以内便可,xml文件中本身找找看吧.你要是问若是放在CollapsingToolbarLayout以前,AppBarLayout以内会怎么样?这样折叠布局就不起做用了.不会折叠了.

总结

CoordinatorLayout是一个“增强版”的 FrameLayout,咱们只须要知道他两个做用

• （1） 用做应用的顶层布局管理器
• （2） 经过为子View指定 behavior 实现自定义的交互行为。

在咱们作 Material Design 风格的app时一般都使用 CoordinatorLayout 做为布局的根节点，以便实现特定的UI交互行为。

咱们能够用它来作各类经常使用的特效，如：
Toolbar + TabLayout 实现 TabLayout 置顶效果
浸入式 + CollapsingToolbarLayout
Fragment + 不一样风格布局

更多能够参考： https://www.jianshu.com/p/e9d...

但愿你们少走弯路吧.其实写帖子挺好的,由于你写的时候也是为本身总结,之后本身用的时候方便找,若是不写可能下次用的时候须要从新学一遍了,因此无论帖子有没有人看,本身必定要多写,跟写笔记还不同,由于帖子你是让别人看的,你会尽可能写的好一点,之后本身也会省事,写笔记是给本身看的,不怕丢人.

沉浸式状态栏+ScrollView顶部伸缩+ActionBar渐变

个人Android重构之旅：框架篇

面试必备之UI刷新大解密