Recycleview实现复杂布局

首先 附上Demo链接和效果供大家参考

Demo

  • 实现思路
  • 代码思考

时间是一切财富中最宝贵的财富。 —— 德奥弗拉斯多

实现思路

开始看到设计稿子的时候,就在考虑这种参差不齐的布局。是不是有得考虑对数据的重新组装和计算每个空白区域的位置等等,因为之前做过类似的补空白的item。但感觉这个要是算起来会更加复杂 就在考虑有没有比较简单的实现思路

  1. 首先我想到了用嵌套的方式去实现,但是那样的话,性能会受到很大的影响。因为UI上滑动的卡顿,是我们最不想见到的情况了。
  2. 经过和朋友的交流,他之前实现过类似得。不过我也抛弃他的做法。因为觉得他的也很复杂,感觉比较难维护
  3. 不过受到他的一些启发,最后通过对数据的处理和实现一个核心方法,实现了最终的效果

核心代码

1.对后台返回的数据进行在整合,类型划分

class Data {
var type: Int? = 0 var kname: String? = "" var year: String? = ""
}

2.重写Recycleview的onAttachedToRecyclerView方法,对返回的列的数量进行区分

 override fun onAttachedToRecyclerView(recyclerView:RecyclerView?) {
super.onAttachedToRecyclerView(recyclerView)
(recyclerView!!.layoutManager as GridLayoutManager).spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
override fun getSpanSize(position: Int): Int {
return if (list[position].type == ITEMTYPE.ITEM_YEAR.ordinal) {
2
} else {
1
}
}
}
}

3.adapter里具体代码实现

class XAdapter : RecyclerView.Adapter<RecyclerView.ViewHolder>() {

    var list = arrayListOf<Data>()

    fun update(list: ArrayList<Data>) {
this.list.clear()
this.list.addAll(list)
notifyDataSetChanged()
}
override fun onCreateViewHolder(parent: ViewGroup?, viewType: Int): RecyclerView.ViewHolder {
return if (viewType == ITEMTYPE.ITEM_YEAR.ordinal) {
YearHolder(LayoutInflater.from(parent!!.context).inflate(R.layout.item_year, null))
} else {
NormalHolder(LayoutInflater.from(parent!!.context).inflate(R.layout.item_normal, null))
}
}
override fun onBindViewHolder(holder: RecyclerView.ViewHolder?, position: Int) {
if (list[position].type == ITEMTYPE.ITEM_YEAR.ordinal) {
(holder as YearHolder).tv.text = list[position].year
} else {
(holder as NormalHolder).normal_tv.text = list[position].kname
}
}
override fun getItemCount(): Int {
return list.size
}
override fun getItemViewType(position: Int): Int {
return list[position].type!!
}
override fun onAttachedToRecyclerView(recyclerView: RecyclerView?) {
super.onAttachedToRecyclerView(recyclerView)
(recyclerView!!.layoutManager as GridLayoutManager).spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
override fun getSpanSize(position: Int): Int {
return if (list[position].type == ITEMTYPE.ITEM_YEAR.ordinal) {
2
} else {
1
}
}
}
}
}
class NormalHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
var normal_tv = itemView.findViewById<TextView>(R.id.normal_tv)
}
class YearHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
var tv = itemView.findViewById<TextView>(R.id.tv)
}

代码思考

由于之前是Java写的,最近在学习Kotlin。个人感觉多学习一些东西还是比较好的。社会在进步嘛,如果赶不上时代的步伐,就会被淘汰,尤其是在中国。

说了那么多没用的,最后还是希望大家能够在码农的道路上越走越远,前辈请多指教。

Recycleview实现复杂布局的更多相关文章

  1. 手把手教你给RecycleView添加头布局和尾布局

    RecycleView想必大家都不陌生,它已他的高拓展性取代了传统布局显示,同时配合协调布局,可以实现很多意想不到的酷炫交互,今天就和大家介绍一下,如何给RecycleView添加头布局和尾布局,同时 ...

  2. RecycleView实现多布局可展开列表

    代码地址如下:http://www.demodashi.com/demo/13193.html 前言 在开发的时候,我们不免会遇到这么一种数据展示,该数据有以下特征: 数据要以列表形式展示 每条数据要 ...

  3. RecycleView 实现多布局

    最近的一个新需求,简单描述下吧: 需求: 目标样式如图所示,我们需要根据需求动态添加网关和设备. 目标有了下面就是怎么实现了.首先我们选用的是RecycleView 那么主要目标就成了 在recycl ...

  4. RecycleView文字吸顶,点击吸顶布局刷新数据

    实现效果 需求 Recycle有一个头布局,可以跟随列表进行滑动 点击头布局之后可以重新加载列表数据 随着头布局的消失,留下一个可点击的布局(该布局在头布局中) 效果类似下图: 淘宝的商品列表,随着我 ...

  5. RecycleView 滑动到底部,加载更多

    android.support.v7 包提供了一个新的组件:RecycleView,用以提供一个灵活的列表试图.显示大型数据集,它支持局部刷新.显示动画等功能,可以用来取代ListView与GridV ...

  6. RecycleView设置顶部分割线(记录一个坑)

    大家都知道,想给RecycleView设置分割线可以重写RecyclerView.ItemDecoration 项目过程中,遇到一个需求:RecycleView顶部有一条灰色的间隔,我想到了给Recy ...

  7. 【腾讯Bugly干货分享】跨平台 ListView 性能优化

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:https://mp.weixin.qq.com/s/FbiSLPxFdGqJ00WgpJ94yw 导语 精 ...

  8. Material Design入门

    本文主要包括以下内容 ToolBar的使用 RecyclerView的定义与使用 ToolBar 风格 (style) 界面 (layout) 程序 (java) 首先自定义一个theme,并将App ...

  9. 解决Scrollview 嵌套recyclerview不能显示,高度不正常的问题

    我们先看一个效果,问题说的就是中间的Grid效果在Scrollview 嵌套recyclerview显示问题,在Android Api 24是好的,不过在5,1,1版本(api 22)缺出现了问题 最 ...

随机推荐

  1. ubuntu启动报/root/.profile mesg:ttyname failed错误的解决办法

    修改/root/.profile文件,如下命令 sudo gedit /root/profile 将文中的最后一行mesg n修改成tty -s && mesg n

  2. NATAPP 内网映射,Visual Studio ,C# 实现本地开发微信公众号,本地调试无需服务器

    点击软件安装教程,根据安装教程,注册帐号,下载软件,配置软件.配置完后如下图,途中红色位置免费版本是随机的. 红色位置是自己的映射域名. 打开VS,并且打开项目,右键项目,在web 选项中修改项目UR ...

  3. 阿里云API网关(10)服务网关业务流程

    一.开放api 二.调用api 三.开发指南 四.其他 1.调试 2.测试 3.mock 4.发布 5.checklist

  4. gradle入门(1-7)eclipse和gradle集成插件的安装和使用

    一.安装gradle插件:buildship 1.安装插件 gradle默认的本地缓存库在c盘user目录下的.gradle文件夹下,安装好gradle后,可以添加环境变量GRADLE_USER_HO ...

  5. Python入门之ATM+购物车代码版思维导图

    该项目结合了ATM模版和购物车需求,整个思维导图用Python代码实现,使用思维导图可以清晰明了的看清整个框架: 过程中,用到了Python的知识有Python常用模块,Python常用内置包,log ...

  6. Django多级评论

    一.原理 #多级评论原理简单原理,弄完之后发现基础白学了 msg_list = [ {'id':1,'content':'xxx','parent_id':None}, {'id':2,'conten ...

  7. asp.net core 二 Nginx Supervisor 负载,监听

           ASP.NET Core负载均衡集群搭建(CentOS7+Nginx+Supervisor+Kestrel)          asp.net core在linux运行下,一但命令行退出 ...

  8. requests+xpath+map爬取百度贴吧

    # requests+xpath+map爬取百度贴吧 # 目标内容:跟帖用户名,跟帖内容,跟帖时间 # 分解: # requests获取网页 # xpath提取内容 # map实现多线程爬虫 impo ...

  9. Spring MVC【入门】就这一篇!

    MVC 设计概述 在早期 Java Web 的开发中,统一把显示层.控制层.数据层的操作全部交给 JSP 或者 JavaBean 来进行处理,我们称之为 Model1: 出现的弊端: JSP 和 Ja ...

  10. 学习React系列(五)——使性能最优

    提高性能可分为两方面: 一.配置层面 二.代码层面 本文只从代码层面考虑: 一.避免重复渲染 这里要说一句: 当shouldComponentUpdate返回false的时候不触发render函数也就 ...