CoordinatorLayout结合AppBarLayout使用

我的博客原文地址：CoordinatorLayout 结合 AppBarLayout使用

分析

• Toolbar 随着列表的滑动而动态显示
• FloatingActionButton 在列表上划时隐藏，下拉时显示

实现

• Toolbar 随着列表的滑动而动态显示这里是将Toolbar嵌套到了AppbarLayout这个控件中，并设置这个属性app:layout_scrollFlags="scroll|enterAlways"，然后在可滑动的控件app:layout_behavior="@string/appbar_scrolling_view_behavior"

• app:layout_scrollFlags:这是滑动标志，设置scroll表示在可滑动列表上滑时Toolbar会一起向上滑动并隐藏，它还有其他值可以设置（如果使用了其他值，必定要再添加上这个值才能起作用），enterAlways表示可滑动列表向下滑动时Toolbar会跟着一起向下滑动显示；snap:表示子View 随着可滑动列表的滑动而直接隐藏或者显示，没有中间子 View 显示的过程；enterAlwaysCollapsed:是enterAlways的增强版，它表示可滑动列表下滑 Toolbar 也跟着下滑，当超过Toolbar的高度后才开始显示子 View，这个子View一般是AppBarLayout布局里面的 view；exitUntilCollapsed：当可滑动列表上划时Toolbar直接显示在顶部，子 View 滑出屏幕。

• AppbarLayout 内部继承了一个垂直的LinearLayout，并在内部做了很多滚动的操作

布局代码如下：

<?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.xxxx.xxx.xxActivity">
    <android.support.design.widget.AppBarLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
    <!--封装的一个toolbar-->
    <com.dongxi.rxdemo.widget.CustomToolbar
      android:id="@+id/custom_toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:background="@color/colorPrimary"
      app:layout_scrollFlags="scroll|enterAlways"
      >
    </com.dongxi.rxdemo.widget.CustomToolbar>
    </android.support.design.widget.AppBarLayout>

  <android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/swipe_refresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >
    <com.dongxi.rxdemo.widget.EmptyRecyclerView
      android:id="@+id/recycler_view"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      >
    </com.dongxi.rxdemo.widget.EmptyRecyclerView>
    <!--空视图-->
    <include android:id="@+id/empty_view"
      layout="@layout/recyclerview_empty_layout"/>
  </android.support.v4.widget.SwipeRefreshLayout>
  <!--悬浮按钮-->
  <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="@mipmap/ic_launcher"
    />
</android.support.design.widget.CoordinatorLayout>

• FloatingActionButton 在列表上划时隐藏，下拉时显示

这个可以有很多方式实现，推荐一篇写的不错的文章FloatingActionButton滚动时的显示与隐藏小结

我这里实现的就比较简单了，思路是在RecyclerView 滑动的时候，去监听滑动状态，如果滑动的距离大于0则上划，需要隐藏悬浮按钮，如果滑动的距离小于0则是下滑，需要展示悬浮按钮，代码如下：

mRecyclerView.setOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);
            }

            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);
                if (dy > 0){
                    mFab.setVisibility(View.GONE);
                }else {
                    mFab.setVisibility(View.VISIBLE);
                }
            }
        });

源码地址
GitHub