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. nodeJs多进程Cluster

    在前端页面中,如果我们想进行多进程,我们会用到WebWorker,而在NodeJs中,我们如果想充分利用服务器核心资源,我们会用到Node中Cluster模块 直接上代码吧: const cluste ...

  2. 前端开发必备之Chrome开发者工具(一)

    本文介绍的 Chrome 开发者工具基于 Chrome 65版本,如果你的 Chrome 开发者工具没有下文提到的那些内容,请检查下 Chrome 的版本 简介 Chrome 开发者工具是一套内置于 ...

  3. float和position

    float float是欺骗父元素,让其父元素误以为其高度塌陷了,但float元素本身仍处于文档流中,文字会环绕着float元素,不会被遮蔽. absolute 但absolute其实已经不能算是欺骗 ...

  4. [洛谷P1198/BZOJ1012][JSOI2008] 最大数 - 树状数组/线段树?

    其实已经学了树状数组和线段树,然而懒得做题,所以至今没写多少博客 Description 现在请求你维护一个数列,要求提供以下两种操作: 1. 查询操作. 语法:Q L 功能:查询当前数列中末尾L个数 ...

  5. 尼姆博弈(Nimm's Game)

    题型: 有3堆各若干个物品,两个人轮流从某一堆取任意多的物品,规定每次至少取1个,多者不限,最后取光者得胜. 思路 首先自己想一下,就会发现只要最后剩两堆物品一样多(不为零),第三堆为零,那面对这种局 ...

  6. MySQL操作与修改表

    插入数据(insert) insert语句的3个主要组成部分: 所要插入数据的表的名称: 表终需要使用的列的名称: 需要插入到列的值. 数字型主键生成机制 数字型主键生成机制,除了随机选择数字外,还可 ...

  7. Python3NumPy——数组(2)之数学空间与NumPy空间

    0 介绍 本文承接上一篇,文章采用新的阐述方式,将数学中的表达与NumPy中的函数关联起来. 采用这种方式,可以直接建立数学表达与计算系统的对应关系,更易理解. 由于博客编写时间有限,每次尝试一个知识 ...

  8. Java进阶篇(二)——抽象类、内部类

    之前在类和对象中我们说到了类的普通特性,本篇将介绍类的一些高级特性. 一.抽象类 抽象类:抽象类是只声明方法的存在而不去具体实现它的类.抽象类不能被实例化,也就是不能创建其对象.使用abstract关 ...

  9. Java 内部类的意义及应用

    众所周知,我们的 C++ 程序语言是多继承制的,而多继承明显的好处就是,相对而言只需要写较少的代码即可完成一个类的定义,因为我们可以通过继承其它类来获取别人的实现. 但是,它也有一个致命性的缺陷,容易 ...

  10. js变量的生命周期

    1.在JavaScript中,对于for循环中定义的i变量,其生命周期在循环结束后仍然是有效的. for (var i=0; i < 10; i++){ doSomething(i); } al ...