RecyclerView上拉隐藏Toolbar,下拉显示

转载 2015年11月19日 15:51:41

如果不用FramLayout,头部的隐藏会导致下面的突然变大

RecyclerView下拉隐藏Toolbar,上拉显示效果图

先说个事:最近我准备做个开源的博客园android客户端!符合Google最新的material design设计风格的!不知道有没有小伙伴愿意和我一起做呢?如果有愿意的,请私信我哦!!!!我还打算每天直播我们工作的进度,代码,以及BUG等!!




效果图

分析

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

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

3.大家不知道注意了了没,就是在toolbar完全隐藏的时候,我们的RecyclerView是完全显示的,并没有距离顶部一个toolbar的高度!!这个地方实现有点取巧 我会在下面的代码中说明!!

代码实现

1.首先来为toolbar实现隐藏和显示的两个动画,在这里 我就定义两个函数来分别实现这两个动画。代码过于简单我就直接上代码了:

代码

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

代码
在这里,我首先是判断是了当前页面的第一个显示的是否是列表中的第一个,如果是就显示toolbar!另外我还定义了两个变量
isshow和disy,分别表示toolbar是否显示和滑动的总距离。还有个细节要注意下 就是当你触发到某种状态之后 disy一定要清零啊!!切记切记!!!另外,这个disy的总滑动距离的计算方式也要注意下!

3.到第二步为止,就可以正常的滑动隐藏啦!!(RecyclerView的Adaper自己写啊!!)。要实现效果图中的效果 我们还差几步!首先呢 ,我们在布局文件上取点巧,就是用FrameLayout作为父控件布局!看xml布局文件:
xml布局

大家可以看到其实recyclerview还是充满屏幕的 那个toolbar只是我们叠在上面的!OK,布局文件取巧完了,我们再来取巧下Adapter!大家应该知道在适配器中有这么个方法: public int getItemViewType(int position) 就是根据位置不同返回不同的ViewType 当然这个ViewType是我们自己定义 在一般的列表中我们的item view都是相同的,但是有时候会有不相同的view在同一个列表中,此时我么就用到这个方法啦!我现在的解决方案呢,就是在第一个View中添加一个和toolbar相同的view,那么在正常的显示的时候 列表的第一个能被用户看到 而不是被toolbar遮挡住了!!!现在就请大家看一下适配器的代码吧!

代码

代码

上面两段代码 就是适配器的全部代码了 !很简单的!大家一看就会拉!!!

好了 今天就讲到这儿吧!!!

欢迎大家评论啊!!!!!!!!!!!!!!!!!!!!!



转载自:http://www.cnblogs.com/likeandroid/p/4454575.html

实现ListView的弹性效果,下拉隐藏ToolBar(ActionBar),上拉显示ToolBar

效果图,gif图片看起来略卡顿,实际很流畅ToolBar要注意,如果不是5.0以上的话,需要在gradle中引入V7包dependencies { compile fileTree(dir: ...

RecyclerView三种显示方式的下拉刷新和上拉加载更多

有关RecyclerView的类似SwipeRefreshLayout的上拉加载更多,我写了一篇博客http://blog.csdn.net/cj_286/article/details/527670...
  • cj_286
  • cj_286
  • 2017年01月06日 09:50
  • 1325

recyclerview 显示图片 glide加载图片 实现点击跳转 上拉刷新下拉加载

首先我们要先将依赖导入工程 compile 'com.android.support:mediarouter-v7:25.0.0' compile 'com.android.su...
  • tuimosz
  • tuimosz
  • 2017年11月09日 19:44
  • 138

SwipeRefreshLayout配合RecyclerView实现下拉刷新和上拉加载更多以及没有数据的显示

http://blog.csdn.net/lovexieyuan520/article/details/50589412(转) SwipeRefreshLayout配合RecyclerV...

RecyclerView 滑动隐藏,显示ToolBar

一:去除自带的ActionBar,在styles.xml二:布局文件,注意这里使用FrameLayout,是为了把ToolBar叠加放在RecyclerView上,如果不这样,当你隐藏ToolBar时...
  • zzldm
  • zzldm
  • 2017年02月13日 16:42
  • 1097

让 Toolbar 随着 RecyclerView 的滚动而显示/隐藏(Part 1)

在这篇文章中,我们将看到如何实现像Google+ 应用程序一样,当列表下滑时,Toolbar和FAB(包括其他的View)隐藏;当列表上滑时,Toolbar和FAB(包括其他的View)显示的效果;这...

Android下拉上滑显示与隐藏Toolbar另一种实现

关于介绍就不说了,不使用嵌套滑动情况下,另一种实现,当然还可以用design包下的CoordinatorLayout.Behavior。比较简单直接添代码:继承RecyclerView.OnScrol...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:RecyclerView上拉隐藏Toolbar,下拉显示
举报原因:
原因补充:

(最多只允许输入30个字)