CoordinatorLayout 与ToolBar 和Fab实现滑动隐藏和显示的学习笔记

1.CoordinatorLayout MD 新控件是一个ViewGroup 里面有许多高级的UI特效 里面主要和AppBarLayout 和折叠布局CollapsingToolbarLayout 上部分使用，下部分和RV和NestedScrollView使用关联layout_behavior 实现一些比较酷炫的效果

2 fab 是FloatingActionButton 是一个ImageButton子类和CoordinatorLayout的behavior实现关联和互动

起源于一个第三方开源项目：https://github.com/makovkastar/FloatingActionButton

有兴趣的小伙伴可以去观看

3 下面来了解这个开源项目的使用

1.可以Fab到ScrollView、ListView、RecyclerView
2，下面以一个lv 与fab 的关联例子为例子
怎么引用相信用过第三方的小伙伴都懂得不在eg:
布局中使用

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             xmlns:fab="http://schemas.android.com/apk/res-auto"
             android:layout_width="match_parent"
             android:layout_height="match_parent">

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <com.melnykov.fab.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_margin="16dp"
        android:src="@android:drawable/ic_dialog_email"
        fab:fab_colorNormal="#ff0"
        fab:fab_colorPressed="#ff0"
        fab:fab_colorRipple="#ff0"
        fab:fab_type="mini"/>
</FrameLayout>`

3 act 使用

 ListView listView = (ListView) findViewById(android.R.id.list);
        listView.setAdapter(new MyLvAdapter(this, Arrays.asList(URLUtils.urls)));
        FloatingActionButton fab = (FloatingActionButton ) findViewById(R.id.fab);
        fab.attachToListView(listView);
        fab.setType(FloatingActionButton.TYPE_MINI);

5 MD 中Fab与Toobar

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.org.gsc.demotest.MainActivity">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="?attr/actionBarSize"
        />
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary">
        <TextView
            android:layout_width="wrap_content"
            android:layout_gravity="center"
            android:text="test"
            android:textSize="20dp"
            android:textColor="@android:color/black"
            android:layout_height="wrap_content"/>
        </android.support.v7.widget.Toolbar>
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="16dp"
        android:src="@android:drawable/ic_dialog_email"
        app:elevation="10dp"
        app:fabSize="normal"
        app:layout_behavior=".FabBehavior"
        app:pressedTranslationZ="12dp"
        app:rippleColor="#ff0"/>
</android.support.design.widget.CoordinatorLayout>
package com.org.gsc.demotest;

import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;

import java.util.Arrays;


public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerview;
    private Toolbar mToolbar;
//    <android.support.design.widget.AppBarLayout
//    android:layout_width="match_parent"
//    android:layout_height="wrap_content">
//    <android.support.design.widget.CollapsingToolbarLayout
//    android:layout_width="match_parent"
//    android:layout_height="200dp"
//    app:collapsedTitleGravity="center"
//    app:contentScrim="@color/colorPrimary"
//    app:expandedTitleGravity="center"
//    app:layout_scrollFlags="scroll|snap|exitUntilCollapsed|enterAlwaysCollapsed"
//    app:title="coordinatorlayout">
//    <android.support.v7.widget.Toolbar
//    android:layout_width="match_parent"
//    android:layout_height="50dp"
//    app:layout_collapseMode="pin">
//    </android.support.v7.widget.Toolbar>
//    </android.support.design.widget.CollapsingToolbarLayout>
//    </android.support.design.widget.AppBarLayout>
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);
        mToolbar= (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(mToolbar);
        mToolbar.setTitle("");
        getSupportActionBar().setDisplayShowTitleEnabled(false);
        recyclerview= (RecyclerView) findViewById(R.id.recyclerview);
        recyclerview.setLayoutManager(new LinearLayoutManager(this));
       recyclerview.setAdapter(new MyAdapter(this, Arrays.asList(URLUtils.urls)));
    }


}

5主要的一个类

package com.org.gsc.demotest;

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.FloatingActionButton;
import android.support.v4.view.ViewCompat;
import android.support.v7.widget.Toolbar;
import android.util.AttributeSet;
import android.view.View;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.DecelerateInterpolator;

/**
 * * 作者：jiangnanyizhou on 2017/12/13 21:26
 * 邮箱：373654981@qq.com
 */
public class FabBehavior extends FloatingActionButton.Behavior {
    private boolean visible = true;//是否可见
//    1、onStartNestedScroll() ： 当观察的View滑动开始的时候进行回调
//    2、onNestedScroll() ： 当观察的View滑动的时候回调
//    3、nestedScrollAxes ： 滑动的关联轴，这里只考虑竖直方向

    public FabBehavior(Context context, AttributeSet attrs) {
        super();
    }

    @Override
    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout,
                                       FloatingActionButton child, View directTargetChild, View target,
                                       int nestedScrollAxes) {
        return nestedScrollAxes == ViewCompat.SCROLL_AXIS_VERTICAL || super.onStartNestedScroll(coordinatorLayout, child, directTargetChild,
                target, nestedScrollAxes);
    }

    @Override
    public void onNestedScroll(CoordinatorLayout coordinatorLayout,
                               FloatingActionButton child, View target, int dxConsumed,
                               int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
        super.onNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed,
                dxUnconsumed, dyUnconsumed);
        if (dyConsumed > 0 && visible) {
            //show
            visible = false;
            onHide(child, (Toolbar) coordinatorLayout.getChildAt(1));
        } else if (dyConsumed < 0) {
            //hide
            visible = true;
            onShow(child, (Toolbar) coordinatorLayout.getChildAt(1));
        }

    }

    public void onHide(FloatingActionButton fab, Toolbar toolbar) {
        toolbar.animate().translationY(-toolbar.getHeight()).setInterpolator(new AccelerateInterpolator(3));
        CoordinatorLayout.LayoutParams layoutParams = (CoordinatorLayout.LayoutParams) fab.getLayoutParams();
        fab.animate().translationY(fab.getHeight() + layoutParams.bottomMargin).setInterpolator(new AccelerateInterpolator(3));
    }

    public void onShow(FloatingActionButton fab, Toolbar toolbar) {
        toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator(3));
        fab.animate().translationY(0).setInterpolator(new DecelerateInterpolator(3));
    }

}