Recycleview上拉隐藏与下拉显示

原文地址:http://www.jianshu.com/p/f384032572d6


我们先来看看效果



分析

1.首先看toolbar的滚动,肯定用属性动画(没得说)

2.toolbar何时滚动?从动图中我们可以看到是用户向下滑动一定的距离之后才消失,出现反之!注意:这边的距离手我们控制随意

3.大家不知道注意了了没,就是在toolbar完全隐藏的时候,我们的RecyclerView是完全显示的,并没有距离顶部一个toolbar的高度!!



继承RecyclerView.OnScrollListener重写onScrolled方法,

同时定义两个抽象方法供我们处理隐藏和显示事件

简单的来说一下思路:当用户向下滑动一定的距离(这个距离我们人为控制),当滑动的距离超过这个距离且当前的toolbar是显示的,就隐藏!反之显示。但是在这里我们要注意下这个问题:就是这个滑动距离怎么算?
我们先来看一下recyclerview的滑动监听函数RecyclerView.OnScrollListener他有两个回调函数 我们只要关注其中的一个就行啦!就是这个:

其中dy就表示垂直方向的滑动距离!了解玩这个之后 我就来看代码

public abstract class HidingScrollListener extends RecyclerView.OnScrollListener {
    private static final int HIDE_THRESHOLD = 20; //移动多少距离后显示隐藏
    private int scrolledDistance = 0; //移动的中距离
    private boolean controlsVisible = true; //显示或隐藏


    @Override
    public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        super.onScrolled(recyclerView, dx, dy);
        if (scrolledDistance > HIDE_THRESHOLD && controlsVisible) {//移动总距离大于规定距离 并且是显示状态就隐藏
            onHide();
            controlsVisible = false; 
            scrolledDistance = 0;//归零
        }
        else if (scrolledDistance < -HIDE_THRESHOLD && !controlsVisible) { 
            onShow();
            controlsVisible = true;
            scrolledDistance = 0;
        }
        if ((controlsVisible && dy > 0) || (!controlsVisible && dy < 0)) { //显示状态向上滑动 或 隐藏状态向下滑动 总距离增加
            scrolledDistance += dy;
        }

    }


    public abstract void onHide();

    public abstract void onShow();
}


事件的处理



recyclerView.addOnScrollListener(new HidingScrollListener() {

            @Override
            public void onHide() {
                Resources resources = MainActivity.this.getResources();
                DisplayMetrics dm = resources.getDisplayMetrics();
                float density = dm.density;
                int width = dm.widthPixels;
                int height = dm.heightPixels;
                fab.animate()
                        .translationY(height - fab.getHeight())//视图translationY属性动态移动到指定值
                        .setInterpolator(new AccelerateInterpolator(2))
                        .start();
                buttom.animate()
                        .translationY(height - buttom.getHeight())
                        .setInterpolator(new AccelerateInterpolator(2))
                        .setDuration(800)
                        .start();
                top.animate()
                        .translationY(-height)
                        .setDuration(800)
                        .setInterpolator(new AccelerateInterpolator(2))
                        .start();
            }

            @Override
            public void onShow() {
                fab.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)).start();
                buttom.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)).setDuration(800).start();
                top.animate().translationY(0).setInterpolator(new DecelerateInterpolator(2)).setDuration(800).start();
            }
});
布局文件
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    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.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:clipToPadding="false" //主要用途:常常用于paddingTop,假设 内部有个属性设置了PaddingTop但是滑动的时候就忽视paddingTop的 则使用该属性 
        android:paddingTop="?attr/actionBarSize" 
        android:layout_height="match_parent"/>

    <LinearLayout
        android:id="@+id/top"
        android:layout_width="match_parent"
        android:layout_height="52dp"
        android:background="#f00"
        android:orientation="vertical">
    </LinearLayout>

    <LinearLayout
        android:id="@+id/buttom"
        android:layout_width="match_parent"
        android:layout_height="52dp"
        android:layout_gravity="bottom"
        android:background="#f00"
        android:orientation="vertical">
    </LinearLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_marginBottom="40dp"
        app:borderWidth="0dp"
        />
</FrameLayout>



  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值