RecyclerView 仿今日头条实现标签管理及动态更新页面内容

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/Utzw0p0985/article/details/93548092

本文较长,阅读大约十分钟


在我的知识星球【Hi Android】中,有一位星友提问 如何实现这个功能,刚好,这个也算是一个不错的知识点,类似于今日头条,于是乎,花点时间总结成一篇文章,供大家阅读

       640?wx_fmt=png      

这个实现方式很多,但是我首先想到的是使用RecyclerView去做,可能还有很多其他的实现方式,这里我就单指我的思路,来实现这个效果。


一.TabLayout + ViewPager

主页可以用TabLayout + ViewPager 去实现,也是比较方便并且简单的一种方式,我们必须先引入需要的依赖:


implementation 'com.android.support:design:28.0.0'

implementation 'com.android.support:recyclerview-v7:28.0.0'


然后去实现我们的布局:

       640?wx_fmt=jpeg      

这个布局是这样的,通过一个相对布局覆盖一个添加的图标在TabLayout上面,而TabLayout作为一个标题导航栏的存在,控制着下方的ViewPager,而ViewPager 需要绑定Fragment,那么问题来了,如何进行双向绑定呢? 可以看下如下代码:

  640?wx_fmt=jpeg      

通过addOnPageChangeListener以及监听addOnTabSelectedListener来实现的双向滑动监听与控制,其中这段代码出现了几个不同的类,比如TagManager,ContentAdapter我们来看下他们是什么内容?

       640?wx_fmt=jpeg      

TagManager只是我为了管理静态的列表数据所创建的类,并没有特殊的用处,因为是Demo,所以定义方面都是比较随意的

       640?wx_fmt=jpeg      

ContentAdapter是ViewPager的适配器,可以看到我为每一个Item都new了一个Fragment并且将标题传入,但是在实际项目中,可能就不是传标题,而是传ID了,我们继续往下看

       640?wx_fmt=jpeg      

在Fragment中,我将获取的title进行了网络请求,并将请求结果显示出来,这个DataManager就是我为了模拟数据而创建的,loadNetworkData模拟网络数据请求:

      640?wx_fmt=jpeg      

这里很好理解,延时2s后将标题和当前的时间返回回去的一个过程,现在我们运行一下即可:


       640?wx_fmt=png      


并且左右滑动上下都是可以联动的,这就是我们想要的一个效果了,那么我们接下来就需要解决标签管理id问题了,点击+号按钮直接跳转到标签管理页面


二.RecyclerView

因为我们的标签都已经定义好了,所以现在想实现这个页面太简单了,首先给大家看下我通过DataManager模拟的数据

       640?wx_fmt=jpeg      

这两个方法只要在开头调用一下就好了,我们的数据就有了,布局写起来也相当简单

       640?wx_fmt=jpeg 考虑到可能会有很多数据,所以选择了ScrollView,并且这里存在两个RecyclerView,你也可以一个RecyclerView多Type形式来做,都是没问题的,所以我们来看下这个比较简单的适配器吧

      640?wx_fmt=jpeg      这个适配器比较简单,就没有什么可说的了,我们直接看核心代码:

       640?wx_fmt=jpeg这段代码首先我们看onCreate中,setDisplayHomeAsUpEnabled是为了显示标题栏的返回键,而onOptionsItemSelected则是为了响应他的点击事件,而两个RecyclerView的创建比较简单,使用的是GridLayoutManager,真正要注意的是ItemAddDel这个方法,当你点击要显示的item后,实则删除,并且将删除的item添加在下方,这样的一个逻辑,最终的效果如图:


       640?wx_fmt=png      


这里我并没有做长按拖拽的功能,因为这是另一种写法了,随意我偷个懒了,Gif效果图会在文末放上,这里我们继续往下讲,添加完之后我们会关闭当前页面,这里不管是点击左上角的返回键还是系统的BACK按钮,我们都setResult来告诉MainActivity我已经回来了该刷新了

640?wx_fmt=jpeg      

这里的逻辑就比较简单了,因为我不确定用户在标签管理页面到底做了多少增删的操作,所以我直接removeAllTags,然后重新addTab,并且因为数据源的改变,ViewPager也要刷新


来看下我们最终的效果吧:


       640?wx_fmt=gif      


但是你会发现,这样做还是会有异常,并且数据不会刷新,这完全在于ViewPager的刷新上,我们需要修改他的适配器来达到我们的目的:

       640?wx_fmt=jpeg      

改动比较大,我们通过Tag去做标记然后通过FragmentManager去更新,这样就可以来看下我们的最终效果:


       640?wx_fmt=gif      


三.总结

这个效果不难吧应该,但是思路需要自己把握,当然,我这写的不算太好,还可以继续优化,包括可以增加长按拖拽,缓存数据等方面,速度也可以继续再优化一下。


关于源码的下载,可以到我的知识星球中本文的评论区下载或者点击阅读原文


也可以加入Android Developer 交流群:417046685  下载


640?wx_fmt=jpeg



猜你喜欢

转载自blog.csdn.net/Utzw0p0985/article/details/93548092