饼状图

项目需求：

实现代码：

package com.example.wavedemo;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.RectF;import android.text.TextPaint;import android.util.AttributeSet;import android.view.View;public class BingPic2 extends View{private Paint paint;private int height;//控件的高度private int width;//空间的宽度private int w;private int h;private TextPaint textpaint;//绘制文字的画笔private int radius;//饼图的半径private RectF rectf1;public BingPic2(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init();}public BingPic2(Context context, AttributeSet attrs) {super(context, attrs);init();}public BingPic2(Context context) {super(context);init();}private void init() {paint=new Paint(Paint.ANTI_ALIAS_FLAG|Paint.DITHER_FLAG);paint.setAntiAlias(true);textpaint=new TextPaint(Paint.ANTI_ALIAS_FLAG|Paint.DITHER_FLAG);textpaint.setAntiAlias(true);textpaint.setColor(Color.parseColor("#123435"));textpaint.setTextSize(20);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {setMeasuredDimension(heightMeasureSpec, heightMeasureSpec);super.onMeasure(widthMeasureSpec, heightMeasureSpec);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);this.w=w;this.h=h;height=h-100;width=w-100;radius=(width-200)/2+50;rectf1=new RectF(100, 100, width, height);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);paint.setColor(Color.parseColor("#4476b6"));canvas.drawArc(rectf1, 0, 30, true, paint);canvas.save();canvas.translate(w/2, h/2);canvas.rotate(15);canvas.drawText("1000", radius, 0, textpaint);canvas.restore();paint.setColor(Color.parseColor("#b94542"));canvas.drawArc(rectf1, 31, 140, true, paint);canvas.save();canvas.translate(w/2, h/2);canvas.rotate(30+140/2);canvas.drawText("1000", radius, 0, textpaint);canvas.restore();paint.setColor(Color.parseColor("#92b44e"));canvas.drawArc(rectf1, 172, 70, true, paint);canvas.save();canvas.translate(w/2, h/2);canvas.rotate(172+70/2);canvas.drawText("1000", radius, 0, textpaint);canvas.restore();paint.setColor(Color.parseColor("#755999"));canvas.drawArc(rectf1, 243, 116, true, paint);canvas.save();canvas.translate(w/2, h/2);canvas.rotate(243+116/2);canvas.drawText("1000", radius, 0, textpaint);canvas.restore();}}

效果图：

这种效果很明显 饼图文字也随着旋转了（主要利用canvas的rotate方法）。

另一只方式：

package com.example.wavedemo;import java.util.List;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Align;import android.graphics.RectF;import android.text.TextPaint;import android.util.AttributeSet;import android.view.View;/** *  * @author huozhenpeng * */public class BingPic extends View {private Paint paint;private int height;// 控件的高度private int width;// 空间的宽度private int w;private int h;private TextPaint textpaint;// 绘制文字的画笔private int radius;// 饼图的半径private RectF rectf1;private List<Integer> lists;// 存放四个角度private List<Integer>  datas;//存放描述数据public BingPic(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init();}public BingPic(Context context, AttributeSet attrs) {super(context, attrs);init();}public BingPic(Context context) {super(context);init();}private void init() {paint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);paint.setAntiAlias(true);textpaint = new TextPaint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);textpaint.setAntiAlias(true);textpaint.setColor(Color.parseColor("#123435"));textpaint.setTextSize(20);textpaint.setTextAlign(Align.CENTER);invalidate();}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {setMeasuredDimension(heightMeasureSpec, heightMeasureSpec);super.onMeasure(widthMeasureSpec, heightMeasureSpec);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);this.w = w;this.h = h;height = h - 100;width = w - 100;radius = (w - 200) / 2 + 50;rectf1 = new RectF(100, 100, width, height);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);paint.setColor(Color.parseColor("#4476b6"));canvas.drawArc(rectf1, 0+1, lists.get(0)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(0)+"",(float) (radius * Math.cos(lists.get(0) / 2 * Math.PI / 180)),(float) (radius * Math.sin(lists.get(0) / 2 * Math.PI / 180)),textpaint);canvas.restore();paint.setColor(Color.parseColor("#b94542"));canvas.drawArc(rectf1, lists.get(0) + 1, lists.get(1)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(1)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1) / 2)* Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1) / 2)* Math.PI / 180)), textpaint);canvas.restore();paint.setColor(Color.parseColor("#92b44e"));canvas.drawArc(rectf1, lists.get(0) + lists.get(1) + 1, lists.get(2)-1,true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(2)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1) + lists.get(2) / 2) * Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1) + lists.get(2) / 2) * Math.PI / 180)), textpaint);canvas.restore();paint.setColor(Color.parseColor("#755999"));canvas.drawArc(rectf1, lists.get(0) + lists.get(1) + lists.get(2) + 1,lists.get(3)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(3)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1)+ lists.get(2) + lists.get(3) / 2)* Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1)+ lists.get(2) + lists.get(3) / 2)* Math.PI / 180)), textpaint);canvas.restore();}public void setData(List<Integer> lists,List<Integer> datas) {if (lists.size()!= 4) {throw new IllegalArgumentException("参数长度应为4"); }this.lists = lists;this.datas=datas;init();}}

配置文件：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:custom="http://schemas.android.com/apk/com.example.wavedemo"    android:layout_width="match_parent"    android:layout_height="wrap_content" >    <com.example.wavedemo.BingPic        android:id="@+id/bingpic"        android:layout_width="270dp"        android:layout_height="270dp" /></RelativeLayout>

MainActivity类

 bingpic=(BingPic) this.findViewById(R.id.bingpic);        List<Integer> lists=new ArrayList<Integer>();        lists.add(30);        lists.add(100);        lists.add(110);        lists.add(120);        List<Integer> datas=new ArrayList<Integer>();        datas.add(10000);        datas.add(20000);        datas.add(3000);        datas.add(40000);        bingpic.setData(lists,datas);

lists集合中的数据加起来应是360度。
效果图：

3.加入动画效果

代码跟上面基本差不多

package com.example.wavedemo;import java.util.List;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Align;import android.graphics.RectF;import android.text.TextPaint;import android.util.AttributeSet;import android.view.View;/** *  * @author huozhenpeng * */public class BingPic extends View implements Runnable{private Paint paint;private int height;// 控件的高度private int width;// 空间的宽度private int w;private int h;private TextPaint textpaint;// 绘制文字的画笔private int radius;// 饼图的半径private RectF rectf1;private List<Integer> lists;// 存放四个角度private List<Integer>  datas;//存放描述数据private boolean isStartAnimation;//是否启用动画private int delta;//如果启用动画，每次的增量值public BingPic(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init();}public BingPic(Context context, AttributeSet attrs) {super(context, attrs);init();}public BingPic(Context context) {super(context);init();}private void init() {paint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);paint.setAntiAlias(true);textpaint = new TextPaint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);textpaint.setAntiAlias(true);textpaint.setColor(Color.parseColor("#123435"));textpaint.setTextSize(20);textpaint.setTextAlign(Align.CENTER);invalidate();}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {setMeasuredDimension(heightMeasureSpec, heightMeasureSpec);super.onMeasure(widthMeasureSpec, heightMeasureSpec);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);this.w = w;this.h = h;height = h - 100;width = w - 100;radius = (w - 200) / 2 + 50;rectf1 = new RectF(100, 100, width, height);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);paint.setColor(Color.parseColor("#4476b6"));canvas.drawArc(rectf1, 0+1, isStartAnimation?(delta<=lists.get(0)-1?delta:lists.get(0)-1):lists.get(0)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(0)+"",(float) (radius * Math.cos(lists.get(0) / 2 * Math.PI / 180)),(float) (radius * Math.sin(lists.get(0) / 2 * Math.PI / 180)),textpaint);canvas.restore();paint.setColor(Color.parseColor("#b94542"));canvas.drawArc(rectf1, lists.get(0) + 1, isStartAnimation?(delta<=lists.get(1)-1?delta:lists.get(1)-1):lists.get(1)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(1)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1) / 2)* Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1) / 2)* Math.PI / 180)), textpaint);canvas.restore();paint.setColor(Color.parseColor("#92b44e"));canvas.drawArc(rectf1, lists.get(0) + lists.get(1) + 1, isStartAnimation?(delta<=lists.get(2)-1?delta:lists.get(2)-1):lists.get(2)-1,true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(2)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1) + lists.get(2) / 2) * Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1) + lists.get(2) / 2) * Math.PI / 180)), textpaint);canvas.restore();paint.setColor(Color.parseColor("#755999"));canvas.drawArc(rectf1, lists.get(0) + lists.get(1) + lists.get(2) + 1,isStartAnimation?(delta<=lists.get(3)-1?delta:lists.get(3)-1):lists.get(3)-1, true, paint);canvas.save();canvas.translate(w / 2, h / 2);canvas.drawText(datas.get(3)+"",(float) (radius * Math.cos((lists.get(0) + lists.get(1)+ lists.get(2) + lists.get(3) / 2)* Math.PI / 180)),(float) (radius * Math.sin((lists.get(0) + lists.get(1)+ lists.get(2) + lists.get(3) / 2)* Math.PI / 180)), textpaint);canvas.restore();}public void setData(List<Integer> lists,List<Integer> datas) {if (lists.size()!= 4) {throw new IllegalArgumentException("参数长度应为4"); }this.lists = lists;this.datas=datas;init();}@Overridepublic void run() {while(true){delta+=1;try {Thread.sleep(30);postInvalidate();} catch (InterruptedException e) {// TODO Auto-generated catch blocke.printStackTrace();}}}/** * 是否有动画 * @param isAnimation */public void setAnication(boolean isAnimation){this.isStartAnimation=isAnimation;init();}}

 bingpic=(BingPic) this.findViewById(R.id.bingpic);        List<Integer> lists=new ArrayList<Integer>();        lists.add(30);        lists.add(100);        lists.add(110);        lists.add(120);        List<Integer> datas=new ArrayList<Integer>();        datas.add(10000);        datas.add(20000);        datas.add(3000);        datas.add(40000);        bingpic.setData(lists,datas);        bingpic.setAnication(true);        new Thread(bingpic).start();

如果需要设置动画

 bingpic.setAnication(true);

 new Thread(bingpic).start();

不需要动画的话，不需要写这两条代码。