<p>先上图,包含统计图初始化时的动画,点击环形的效果</p>
<p><img alt="没有数据时状态" class="blockcode" height="339" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-56aaf7e58afe81f4047968800036f75a.jpg" width="288"><img alt="" class="blockcode" height="347" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-57eed2564510d6579360e2860439879e.jpg" width="302"><img alt="" class="blockcode" height="346" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-fc18ef5e0845e0347aa67edd1869799a.jpg" width="292"></p>
<p>饼状图根据效果不同,调用的APi参数略微有差异,有些同学可能不想要中间的空白直接全部展示扇形,emmmm。这种需求比你现在看到的这个样子 要简单的多,看完这种样式的,其他的实现方式也就懂了。</p>
<p>首先,实现思路不能落下:</p>
<p>1、在自定义View里面初始化的时候(构造方法里),</p>
<pre class="blockcode"><code>setLayerType(View.LAYER_TYPE_SOFTWARE, null);</code></pre>
<p><strong>这行代码不能忘,这个是硬件加速,某些低端手机上如果不写着一行,阴影部分无法展示,而且相邻扇形图无法无缝对接,即便看起来你的代码并没有什么问题。</strong></p>
<p>2、计算画布的大小以及定位我们的<strong>统计图位置</strong></p>
<pre class="blockcode"><code>@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
//View宽高
mTotalWidth = w - getPaddingLeft() - getPaddingRight();
mTotalHeight = h - getPaddingTop() - getPaddingBottom();
//饼状图半径
mRadius = WindowsUtil.dp2px(178) / 2;
//参与计算的扇形半径(我们是画一个空心圆,例如:画圆的线的粗为2,实际需要半径为10,如果输入参数时半径不减去线粗的1/2的话 看到的环形外圈半径为11,内圈半径为9)
calculateRadius = mRadius - mRadius / 4;
mRectF.left = -calculateRadius;
mRectF.top = -calculateRadius;
mRectF.right = calculateRadius;
mRectF.bottom = calculateRadius;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//限定位置(原点为中心点)
canvas.translate(mTotalWidth / 2, mTotalHeight / 2);
//绘制饼图的每块区域
drawPiePath(canvas);
}</code></pre>
<p>3、好了,直接说重点,看看 <strong>drawPiePath(canvas)</strong>;方法里怎么操作,怎么去绘制的</p>
<pre class="blockcode"><code> /**
* 绘制饼图的每块区域 和文本
*
* @param canvas
*/
private void drawPiePath(Canvas canvas) {
//起始地角度
float startAngle = starAngle;
if (mDataList != null && mDataList.size() > 0) {
for (int i = 0; i < mDataList.size(); i++) {
String name = mDataList.get(i).getName() + (int) mDataList.get(i).getValue();
float sweepAngle = mDataList.get(i).getValue() / mTotalValue * 360;//每个扇形的角度
sweepAngle = sweepAngle * percent;
mPaint.setColor(mDataList.get(i).getColor());
mLinePaint.setColor(mDataList.get(i).getColor());
mTextPaint.setColor(mDataList.get(i).getColor());
double x1, y1;
int addLength = 0;
if (i != 0) {
if (i > 3) {
for (int c = 0; c < maxListNumH; c++) {
if (lineAndTextHorizontalAddress[i - c] > 0) {
addLength += WindowsUtil.dp2px(mTextPaint.measureText(name) / (maxListNumH * 2));
}
}
}
if (mDataList.get(i).getQuadrant() == 1 || mDataList.get(i).getQuadrant() == 3) {
x1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint.measureText(name) * 0.3);
y1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint.measureText(name) * 0.4);
} else {
if (mDataList.get(i - 1).getQuadrant() != mDataList.get(i).getQuadrant()) {
x1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint.measureText(name) * 0.3);
y1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint.measureText(name) * 0.4);
} else {
if (lineAndTextHorizontalAddress[i - 1] == 0) {
x1 = mRadius + LineLength + addLength;
y1 = mRadius + LineLength;
} else {
x1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint.measureText(name) * 0.3);
y1 = mRadius + LineLength + lineAndTextHorizontalAddress[i] * (mTextPaint |
|