安卓(Android)开发之自定义饼状图
程序员文章站
2024-03-05 19:06:25
先来看看效果图
先分析饼状图的构成,非常明显,饼状图就是一个又一个的扇形构成的,每个扇形都有不同的颜色,对应的有名字,数据和百分比。
经以上信息可以得出饼状图的最基...
先来看看效果图
先分析饼状图的构成,非常明显,饼状图就是一个又一个的扇形构成的,每个扇形都有不同的颜色,对应的有名字,数据和百分比。
经以上信息可以得出饼状图的最基本数据应包括:名字 数据值 百分比 对应的角度 颜色。
用户关心的数据 : 名字 数据值 百分比
需要程序计算的数据: 百分比 对应的角度
其中颜色这一项可以用户指
public class piedata { private string name; // 名字 private float value; // 数值 private float percentage; // 百分比 private int color = 0; // 颜色 private float angle = 0; // 角度 public piedata(@nonnull string name, @nonnull float value) { this.name = name; this.value = value; } }
自定义view:
先按照自定义view流程梳理一遍(确定各个步骤应该做的事情):
步骤 | 关键字 | 作用 |
1 | 构造函数 | 初始化(初始化画笔paint) |
2 | onmeasure | 测量view的大小(暂时不用关心) |
3 | onsizechanged | 确定view大小(记录当前view的宽高) |
4 | nlayout | 确定子view布局(无子view,不关心) |
5 | ondraw | 实际绘制内容(绘制饼状图) |
6 | 提供接口 | 提供接口(提供设置数据的接口) |
代码如下:
public class pieview extends view { // 颜色表 private int[] mcolors = {0xffccff00, 0xff6495ed, 0xffe32636, 0xff800000, 0xff808000, 0xffff8c69, 0xff808080, 0xffe6b800, 0xff7cfc00}; // 饼状图初始绘制角度 private float mstartangle = 0; // 数据 private arraylist<piedata> mdata; // 宽高 private int mwidth, mheight; // 画笔 private paint mpaint = new paint(); public pieview(context context) { this(context, null); } public pieview(context context, attributeset attrs) { super(context, attrs); mpaint.setstyle(paint.style.fill); mpaint.setantialias(true); } @override protected void onsizechanged(int w, int h, int oldw, int oldh) { super.onsizechanged(w, h, oldw, oldh); mwidth = w; mheight = h; } @override protected void ondraw(canvas canvas) { super.ondraw(canvas); if (null == mdata) return; float currentstartangle = mstartangle; // 当前起始角度 canvas.translate(mwidth / 2, mheight / 2); // 将画布坐标原点移动到中心位置 float r = (float) (math.min(mwidth, mheight) / 2 * 0.8); // 饼状图半径 rectf rect = new rectf(-r, -r, r, r); // 饼状图绘制区域 for (int i = 0; i < mdata.size(); i++) { piedata pie = mdata.get(i); mpaint.setcolor(pie.getcolor()); canvas.drawarc(rect, currentstartangle, pie.getangle(), true, mpaint); currentstartangle += pie.getangle(); } } // 设置起始角度 public void setstartangle(int mstartangle) { this.mstartangle = mstartangle; invalidate(); // 刷新 } // 设置数据 public void setdata(arraylist<piedata> mdata) { this.mdata = mdata; initdate(mdata); invalidate(); // 刷新 } // 初始化数据 private void initdate(arraylist<piedata> mdata) { if (null == mdata || mdata.size() == 0) // 数据有问题 直接返回 return; float sumvalue = 0; for (int i = 0; i < mdata.size(); i++) { piedata pie = mdata.get(i); sumvalue += pie.getvalue(); //计算数值和 int j = i % mcolors.length; //设置颜色 pie.setcolor(mcolors[j]); } float sumangle = 0; for (int i = 0; i < mdata.size(); i++) { piedata pie = mdata.get(i); float percentage = pie.getvalue() / sumvalue; // 百分比 float angle = percentage * 360; // 对应的角度 pie.setpercentage(percentage); // 记录百分比 pie.setangle(angle); // 记录角度大小 sumangle += angle; log.i("angle", "" + pie.getangle()); } }
注意:在更改了数据需要重绘界面时要调用invalidate()这个函数重新绘制。
以上就是小编为大家整理的安卓(android)中自定义饼状图的制作思路,利用实例代码实现饼状图就很简单了,希望本文对大家开发安卓(android)有所帮助。
上一篇: PTA - 猴子吃桃问题