Android-仪表盘控件仿芝麻信用

前言

因为项目须要使用到仪表盘图表，因此就本着一向的操做流程就来github上面找，结果发现不少图表或者不是我须要的或者扩展性不强，因此就本身动手写了一个扩展性较强的，但愿能帮助到有须要的人。（不过本人能力有限，有不足的地方还请见谅）

效果

详细的使用请点击：Github传送门

先定个小目标

因为每一个公司的UI确定都有不一样的想法，设计出来的效果图也千奇百怪。因此我一开始的想法是能写一个基类的仪表盘图表，不须要懂得太多的自定义View知识也能作出UI所须要的效果。

我就想尝试着能不能本身写一个，万一能帮助到其余人呢。（梦想仍是要有的）

因此我就抽取了一个BaseDashboardView类，并实现了三个Style的仪表盘图表。而这三个仪表盘除去一些画笔的初始化和参数的设置，绘制的代码都在70行内。下面就来看一下如何定义一个本身的仪表盘图表吧。

而后去作吧

建立一个View而后去继承 BaseDashboardView 这时须要实现如下方法：

protected abstract void initView();

    protected abstract void initArcRect(float left, float top, float right, float bottom);

    protected abstract void drawArc(Canvas canvas, float arcStartAngle, float arcSweepAngle);

    protected abstract void drawProgressArc(Canvas canvas, float arcStartAngle, float progressSweepAngle);

    protected abstract void drawText(Canvas canvas, int value, String valueLevel, String currentTime);
    
复制代码

而后让咱们来看看每一个方法都是什么用的。

initView() 就是初始化设置，如建立画笔等。

initArcRect(float left, float top, float right, float bottom) 在咱们绘制圆弧的时候能够传入Rect对象来肯定圆弧的绘制范围，须要这里就是给咱们初始化圆弧的区域的。 如:mRectArc = new RectF(left, top, right, bottom);

drawArc(Canvas canvas, float arcStartAngle, float arcSweepAngle)这是就是开始正式的绘制背景圆弧了，arcStartAngle表示圆弧的起始角度，arcSweepAngle表示圆环一共多少度。咱们经过刚才的Rect就能够绘制出一个圆弧如：canvas.drawArc(mRectOuterArc, arcStartAngle, arcSweepAngle, false, mPaintArc);可是要主要画笔的样式要设置为Paint.Style.STROKE

drawProgressArc(Canvas canvas, float arcStartAngle, float progressSweepAngle)而这里是绘制进度圆弧的地方，progressSweepAngle进度的幅度已经在BaseDashboardView中计算好，只须要经过drawArc中的同样绘制个圆弧就行。

drawText(Canvas canvas, int value, String valueLevel, String currentTime)在这里能够把文字绘制到你想要他出现的地方就OK拉。数据已经在BaseDashboardView中处理过，直接绘制就能够。

因为不少逻辑的计算和动画都是在BaseDashboardView中去实现，因此咱们只须要实现这几个方法，而后实现一些绘制的逻辑就能够咯。若是在绘制方面有什么问题的能够查看一下3个样式的DashboardView，若是是对底层的计算有兴趣的能够看一下BaseDashboardView。

接下来就去扩展

这里主要说一个方法setCalibration(int[] calibrationNumberText, String[] calibrationBetweenText,int largeCalibrationBetweenNumber)

而后主要说一下calibrationNumberText和calibrationBetweenText参数，他们的初始默认值是 int[]{350, 550, 600, 650, 700, 950}和String[]{"较差", "中等", "良好", "优秀", "极好"} 那这样其实组成了一个区间 350 较差 550 中等 600 良好 650 优秀 700 极好 950 他的意思为350-550的为较差，其余依次类推，可是每一个区间的大小是不同的，较差的区间为550-350=200，而中等区间为650-550=50。可是每一个区间在图表上显示的区域大小确实相同的。那么在计算进度幅度的时候须要区别计算。

而个人实现方式是首先判断当前value在第几个区间中，如当前value=575。那么经过循环的方式能够知道当前value处在550和600之间。而后经过 (575 - 550) / (600 - 550)公式计算出当前值在这个区间内占的百分比。而后经过每一个区间的角度算出当前进度条的幅度。

而除了刻度的扩展其实还有不少其余的可配置项，能够经过github进行查看。