Chart 绘制，自带动画效果

package com.example.canvasdemo;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.FontMetrics;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Transformation;

public class ChartView extends View{

	@SuppressLint("NewApi")
	public ChartView(Context context, AttributeSet attrs, int defStyleAttr,
			int defStyleRes) {
		super(context, attrs, defStyleAttr, defStyleRes);
		initData();
	}

	public ChartView(Context context, AttributeSet attrs, int defStyleAttr) {
		this(context, attrs, defStyleAttr, 0);
	}

	public ChartView(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
	}

	public ChartView(Context context) {
		this(context, null);
	}

	public void initData(){
		mPaints = new Paint[mChartNum];
		//--初始化需要的画笔
		for (int i = 0; i < mPaints.length; i++) {
			mPaints[i] = new Paint();
			mPaints[i].setAntiAlias(true);
			mPaints[i].setDither(true);
			mPaints[i].setStyle(Paint.Style.FILL);
			mPaints[i].setColor(0x880FF000 + i * 0x019e8860);
			mPaints[i].setTextSize(30);
		}

		initAnim();
	}

	/**
	 * 初始化自定义动画
	 */
	private void initAnim(){
		anim = new ChartAnim();
		anim.setDuration(2000);
	}

	/**
	 * 直方图的数目
	 */
	private int mChartNum = 8;
	private Paint[] mPaints;

	/**
	 * 直方图的宽度
	 */
	private int mChartW = 80;

	//--间隔
	private int mInterval = 20;

	@SuppressLint("DrawAllocation")
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		//--绘制背景色
		canvas.drawColor(Color.TRANSPARENT);
		canvas.save();
		canvas.translate(100, 0);
		//--绘制直方图
		for (int i = 0; i < mPaints.length; i++) {
			canvas.drawRect(new Rect(mChartW*i + mInterval*(i+1),(int)(mH/2 - mmLs[i] * percent),mChartW*(i+1) + mInterval*i,mH/2), mPaints[i]);
		}

		//--绘制文本
		for(int i = 0; i < mmLs.length; i ++){
			int textw = (int) mPaints[i].measureText(mmLs[i]+"");
			FontMetrics mfontm = mPaints[i].getFontMetrics();
			int texth = (int) (mfontm.descent - mfontm.ascent);
			int textT = (mChartW*(i+1) + mInterval*i) - (mChartW*i + mInterval*(i+1));
			int temp = (textT - textw)/2;
			canvas.drawText(mmLs[i]+"",temp + mChartW*i + mInterval*(i+1), mH/2 + texth + mInterval, mPaints[i]);
		}
		//--底部分割线的绘制
		Paint mPaint = new Paint();
		mPaint.setDither(true);
		mPaint.setAntiAlias(true);
		mPaint.setStrokeWidth(3);
//		int rNum = (int) (Math.random()*mmLs.length);
		mPaint.setColor(0x880FF000 + 2*0x019e8860);
		canvas.drawLine(0, mH/2 , (mChartW + mInterval)*mChartNum, mH/2 , mPaint);
		canvas.restore();
	}

	private float percent = 0;
	private int mW;
	private int mH;
	private int[] mmLs;
	private ChartAnim anim;
	@Override
	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
		super.onSizeChanged(w, h, oldw, oldh);
		this.mW = w;
		this.mH = h;

		initChartData();
	}

	private void initChartData(){
		mmLs = new int[mChartNum];
		for(int i =0 ;i < mmLs.length; i++){
			mmLs[i] = (int)(Math.random()*mH/2);
			Log.d("TAG","initData = " + mmLs[i]);
		}
	}

	public void startAnim(){
		this.startAnimation(anim);
	}

	private class ChartAnim extends Animation{

		/**
		 * 每次系统调用这个方法时， 改变percent的值，
		 * 然后调用postInvalidate()不停的绘制view。
		 */
		@Override
		protected void applyTransformation(float interpolatedTime,
				Transformation t) {
			super.applyTransformation(interpolatedTime, t);
			percent = interpolatedTime;
			postInvalidate();
		}
	}

	public void reset(){
		initChartData();
	}
}

　　

上述中关键处代码解释已经添加

辣么接下来就是直接效果图：