目录正文1.心电图2.睡眠图正文之前章节介绍了RecyclerChart中一些通用的图表的相关绘制逻辑，本章节介绍两种Special的Chart的绘制，一种是心电图，一种是睡眠图。首先我们来看下...
目录
正文1. 心电图2. 睡眠图正文
之前章节介绍了RecyclerChart 中一些通用的图表的相关绘制逻辑，本章节介绍两种Special的Chart的绘制，一种是心电图，一种是睡眠图。首先我们来看下心电图EcgChart的绘制。
1. 心电图
EcgChart 跟LineChart形态上是相似的，但是EcgChart的点相对于LineChart密集的多，之前的LineChart相当于每个RecyclerView的Itemview 中的Model对应的value值，而心电图的ItemDataModel背后有一个List的value值与之对应，针对1080px width的手机而言，极大可能地超出了1px一个Point，所以这里的绘制逻辑换成每个Item中对应一段path, phppath 是由ItemDataModel的List，注意处理前后两个Path的衔接处即可, 这里具体List的大小可根据需求来定，原始的每个Item中是20个Point。首先先看下横屏无线右滑的EcgChart动图gif:
绘制的逻辑代码,%20因为每个ItemView的width也很小就没有像之前的LineChart单独处理边界的绘制问题了。
private%20<T%20extends%20BarEntry>%20void%20drawLineChartWithoutPoint(Canvas%20canvas,%20RecyclerView%20parent,%20YAxis%20mYAxis)%20{
%20%20final%20float%20parentRightBoard%20=%20parent.getWidth()%20-%20parent.getPaddingRight();
%20%20final%20float%20parentLeft%20=%20parent.getPaddingLeft();
%20%20//BaseBarChartAdapter%20adapter%20=%20(BaseBarChartAdapter)%20parent.getAdapter();
%20%20final%20int%20childCount%20=%20parent.getChildCount();
%20%20for%20(int%20i%20=%200;%20i%20<%20childCount;%20i++)%20{
%20%20%20%20View%20child%20=%20parent.getChildAt(i);
%20%20%20%20T%20barEntry%20=%20(T)%20child.getTag();
%20%20%20%20float%20preValue%20=%20Integer.MIN_VALUE;
%20%20%20%20if%20(i%20>%200){
%20%20%20%20%20%20View%20pointF1Child%20=%20parent.getChildAt(i%20-%201);
%20%20%20%20%20%20T%20barEntryLeft%20=%20(T)%20pointF1Child.getTag();
%20%20%20%20%20%20if%20(barEntryLeft%20instanceof%20%20EcgEntry){
%20%20%20%20%20%20%20%20List<Float>%20values%20=%20((EcgEntry)%20barEntryLeft).values;
%20%20%20%20%20%20%20%20if%20(values.size()%20>%200){
%20%20%20%20%20%20%20%20%20%20preValue%20=%20%20values.get(values.size()%20-%201);
%20%20%20%20%20%20%20%20}
%20%20%20%20%20%20}
%20%20%20%20}
%20%20%20%20if%20(barEntry%20instanceof%20EcgEntry){
%20%20%20%20%20%20List<Float>%20values%20=%20((EcgEntry)%20barEntry).values;
%20%20%20%20%20%20RectF%20rectF%20=%20ChartComputeUtil.getBarChartRectF(child,%20parent,%20
%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20mYAxis,%20mLineChartAttrs,%20barEntry);
%20%20%20%20%20%20if%20(rectF.left%20<%20parentLeft%20||%20rectF.right%20>%20parentRightBoard){
%20%20%20%20%20%20%20%20continue;
%20%20%20%20%20%20}
%20%20%20%20%20%20float%20innerItemWidth%20=%20rectF.width()/values.size();
%20%20%20%20%20%20float%20startX%20=%20rectF.left;
%20%20%20%20%20%20//%20preValue%20用来衔接两个ItemView中的path,防止断连的问题。
%20%20%20%20%20%20preValue%20=%20preValue%20==%20Integer.MIN_VALUE?values.get(0):%20preValue;
%20%20%20%20%20%20float%20firstPosition%20=%20ChartComputeUtil.getYPosition(preValue,%20parent,
%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20mYAxis,%20mLineChartAttrs);
%20%20%20%20%20%20Path%20pathItem%20=%20new%20Path();
%20%20%20%20%20%20pathItem.moveTo(startX,%20firstPosition);
%20%20%20%20%20%20for%20(int%20j%20=%200;%20j%20<%20values.size();%20j++)%20{
%20%20%20%20%20%20%20%20float%20yPosition%20=%20ChartComputeUtil.getYPosition(values.get(j),%20
%20%20%20%20%20%20%20%20%20parent,%20mYAxis,%20mLineChartAttrs);
%20%20%20%20%20%20%20%20pathItem.lineTo(startX%20+%20j%20*%20innerItemWidth,%20yPosition%20);
%20%20%20%20%20%20}
%20%20%20%20%20%20canvas.drawpath(pathItem,%20mLineChartPaint);
%20%20%20%20}
%20%20}
}
EcgChart整体的绘制逻辑还是比较简单的,%20这里的Entry对象也如上所述的包含一个List
public%20class%20EcgEntry%20extends%20BarEntry{
%20%20%20%20public%20List<Float>%20values%20=%20new%20ArrayList<>();
%20%20%20%20public%20EcgEntry(int%20i,%20float%20value,%20long%20timestamp,%20int%20type)%20{
%20%20%20%20%20%20%20%20super(i,%20value,%20timestamp,%20type);
%20%20%20%20}
}
2.%20睡眠图
之前在MPChart的绘制中有介绍过睡眠泳道图的绘制，不同与之前的Chart图表，每个Itemview%20是等宽的，这里的Item是根据睡眠时长然后睡眠的Type来确定不同的高度、颜色等。这里先看下睡眠泳道动图gif:
看下代码在SleepChartAdapter中设置不同的ItemView的宽度，setLinearLayout函数设置：
以上代码里通过SleepItemEntry计算出ItemWidth的宽度，然后传给setLinearLayout函数：
介绍完设置 Sleep编程客栈泳道图 ItemView 不一致的宽度，下边就是如何绘制了, 因为Adpter里ItemView已经设置了它的width了，所以拿到ItemView的宽度之后，就可以直接根据它的宽度，然后不同的type确定其高度。
确定每一个RectF之后，绘制即可：
本文主要介绍在除了基本的BarChart、LineChart、BezierChart等之外，可以看到RecyclerChart 可以绘制更多的可能性的图表，在RecyclerView的 Adapter， dataModel, Render的配合下会有不同的可能性，能够解决各种不同的需求，同样例如之前的MPChart中介绍的SegmentBarChart这种变种的柱状图等，都可以实现的。
以上就是android RecyclerChart其它图表绘制示例详解的详细内容，更多关于RecyclerChart图表绘制的资料请关注我们其它相关文章！
