RecylerChart图表

·  阅读 2244

前段时间写了几篇关于MPAndroidChart自定义相关的文章,放在专栏 juejin.cn/column/7135… 里。其实笔者除了对MPChart有做自定义之外,还自己写了一个图表库,这个库基于RecyclerView来实现的,所以起名为RecylcerChart,小部分代码参照了MPChart,然后也有实现了一些特定的功能,例如可以无限左右滑动加载数据,高亮选中popup弹框,解决长按popup滑动跟RecyclerView本身的滑动冲突等棘手的问题, 借用RecylcerView 有个好处是它自己本身有对Adapter里的数据进行管理,过多它会回收,不需要笔者再去单独进行处理,省去了部分工作。具体细节在后续的文章里会做详细的介绍。

RecyclerChart 目前支持实现柱状图、线形图、曲线图、睡眠泳道图、之前MPChart中的Segment柱状图,其实绘制的逻辑依旧用的Render类去绘制,所以之前MPChart中自定义的系列图表,在RecyclerChart 里也可以实现。RecyclerView区别于MPChart的地方在于,部分绘制的组件不同,但大致的绘制的思想相同。

在一个RecyclerView里究竟如何去绘制,如何去自定义绘制呢,首页我们梳理一下RecyclerView中的几个主要的Component: RecyclerView本身,存储绘制需要的数据的Adapter, 同时里面会包含我们的ItemView,然后是控制整体Layout的LayoutManager,还有平常用的稍微少些用于自定义divideLine之类的RecyclerView.ItemDecoration等,这里笔者就是借助ItemDecoration来自定义绘制的,拓展了一下它绘制的功能,平常仅用于绘制divideLine的ItemDecoration,承担起整个的自定义绘制工作,所以真正的ItemView反倒是变成了一个空壳子。我们看一下他们之间的结构关系:

1.0RecyclerChart简略关系图.png

这里RecyclerView扮演类似MPChart中的Chart的角色,真正的绘制在ItemDecoration中的Render,Render绘制依赖的一些主要Component,例如Entry、XAxis、YAxis,控制 选中高亮的ValueFormatter,这些大致跟之前的MPChart的类似,有区别处会在遇到的时候做介绍。

接下里看几种借助RecyclerChart实现的成品的图表:

折线图:

曲线图:

柱状图:

泳道图:

线性柱状混合图:

心电图:

以上介绍了基于RecyclerChart绘制的几种图表类型,于MPChart不同之处在于,没有多指缩放的实现,但它也有一些特殊的实现例如左右无线滑动动态加载数据;长按高亮滑动与RecyclerView左右滑动的冲突解决;实现手机屏幕内展示单位时间段的数据(比如一个月、一天)滑动停止时,View的回弹,让左右边界跟业务上的边界重合。之后的文章会一一介绍这些功能点的具体实现逻辑,还有部分笔者认为注入了我精力的实现逻辑。

之前的MPChart有读者问源码那个是没有放,RecyclerChart的lib(没有上传专门的aar包以及maven库)以及相对简单的绘制demo,有需要参考的读者可参考:github.com/yinxiucheng…

分类:
Android
收藏成功!
已添加到「」, 点击更改