Android表盘自定义控件

Header

很久不写自定义控件，最近一个项目中有个控件需要进行自定义，便拿着这个控件重新熟悉了一下自定义控件的流程和思维方式，自定义控件在Android中算是一个基础技能，熟悉自定义控件，可以在原生控件无法满足需求的情况下游刃有余，下面来看看这个简单的自定义控件是如何实现的。

Body

效果

首先，要做的是一个半圆环控件，类似汽车速度仪表盘，项目中是连接了一块称重表，当读入表上数据后，将称重数据在该控件上显示出来。开始中间指针指向0KG，当读到称重表的200读数时，控件的蓝色圆环弧形延申到对应200的位置。

思路

首先第一，对需求进行分析，将控件进行拆分。图中可以看出，静态的东西有白色半圆环，0KG，150KG，300KG的刻度文本，过磅中文本，需要进行旋转的中间箭头，需要进行数值变化的称重读数文本，需要进行动态绘制的蓝色半圆弧。所以将控件分为五个部分。

1.白色圆弧（whiteArc）

2.中间箭头（centerArrow）

3.称重读数（weighingData）

4.蓝色圆弧（blueArc）

5.刻度文本（meterData）

再重新聊一下自定义控件的流程。首先控件需要继承View或ViewGroup，另外重写onMeasure和onDraw方法。

onMeasure和onDraw方法具体时用来做什么的，网上应该有大量的文章可以参考，这里就不再说了。

接下来就开始分析该控件的绘制思路。

首先，我们需要将画布限制为一个正方形，这样便于我们寻找圆弧的圆心，则画布为图中最大的正方形。然后确定两个圆弧所处的矩形位置，也就是小的正方形，所以圆弧大致的位置如图所示，半径为小正方形边长的一半（radius）。画圆弧的起始位置在图中所标虚线位置，顺时针画圆弧，那么就是起始从150度的位置，绘制240度的圆弧。那么先开始圆弧的绘制。

1.绘制前的准备工作

准备好各个部分所需要的画笔，数据声明，并在构造函数中进行初始化

2.限制画布比例为正方形（不论布局中对控件设置的高度为多少，都与宽度等长，便可限制为正方形）

拿到画布的布局宽度，然后通过setMeasureDimension方法，将画布限制为边长为width的正方形。

3.确定圆弧的矩形范围，确定白色圆弧画笔的边宽，并绘制白色圆弧。

则得到一个白色半圆弧

4.绘制中间箭头

先看下我得到的中间箭头的资源图片

资源图片为一个箭头朝向45度角的正方形箭头，黑色地方为透明。箭头的朝向是动态的，所以我们要动态配置箭头的朝向。另外，资源图片的大小不一定满足当前布局所设置的宽高，所以在进行绘制之前，我们需要对该图片进行一个等比例的缩放，以达到适配的效果。

首先通过BitmapFactory获取到图片，并对图片以画布的某个比例进行缩放，在缩放之前，要先将图片旋转到箭头所指的初始位置。代码如下

那么大概就是这样的一个效果

由于箭头的图片本身就处在一个 -45度的位置，那么需要再旋转 -165度的位置，就将箭头处在了150度的初始位置，另外，我们把整个圆弧的数据最大值设置为300，currentData是当前的称重数据，-165+（weep Angle* currentData / 300）就可以将箭头指向当前数据所对应的方向，后面再动态修改currentData，就可以让箭头进行旋转动画了。

5.绘制蓝色圆弧

蓝色圆弧和中间的箭头一样，也是动态的，要随着数据的变化而变化，所以也要与currentData来配合