美文网首页
Recycleview上拉隐藏与下拉显示

Recycleview上拉隐藏与下拉显示

作者: Journey_lm | 来源:发表于2019-10-28 17:26 被阅读0次

    我们先来看看效果

    分析

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

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

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

    继承RecyclerView.OnScrollListener重写onScrolled方法,

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

    简单的来说一下思路:当用户向下滑动一定的距离(这个距离我们人为控制),当滑动的距离超过这个距离且当前的toolbar是显示的,就隐藏!反之显示。但是在这里我们要注意下这个问题:就是这个滑动距离怎么算?

    我们先来看一下recyclerview的滑动监听函数RecyclerView.OnScrollListener他有两个回调函数 我们只要关注其中的一个就行啦!就是这个:

    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();

                }

    });

    布局

    相关文章

      网友评论

          本文标题:Recycleview上拉隐藏与下拉显示

          本文链接:https://www.haomeiwen.com/subject/bkwzbftx.html