計(jì)步器（Pedometer）全部項(xiàng)目標(biāo)源代碼，感興趣的同伙可以下載來看看(記得幫小弟在github打個(gè)星~)
https://github.com/296777513/pedometer
本篇文┞仿講的demo在這里下載(0分下載)：
http://download.csdn.net/detail/a296777513/8328461
先給幾張效不雅圖：
[img]http://img.blog.csdn.net/20150105142701734?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYTI5Njc3NzUxMw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[img]http://img.blog.csdn.net/20150105142638187?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYTI5Njc3NzUxMw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[img]http://img.blog.csdn.net/20150105142713387?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvYTI5Njc3NzUxMw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
如上圖所示，點(diǎn)擊中心的圓圈會依次顯示3個(gè)不合的頁面（信息），并且圓形的進(jìn)度條是動態(tài)增長的，效不雅照樣可以的。然后給出源代碼，供大年夜家參考
CircleBar的重要代碼

package com.example.histogram.widet;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Paint.Align;
import android.graphics.Paint.Style;
import android.util.AttributeSet;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Transformation;
/**
 * 這是持續(xù)view的一個(gè)從新畫圖的圓圈的一個(gè)類 Author: liyachao email:[email protected] Date: 2015-1-5
 * Time: 下晝2:39
 */
public class CircleBar extends View {

	private RectF mColorWheelRectangle = new RectF();// 圓圈的矩形范圍
	private Paint mDefaultWheelPaint;// 繪制底部灰色圓圈的畫筆
	private Paint mColorWheelPaint;// 繪制藍(lán)色扇形的畫筆
	private Paint textPaint;// 中心文字的畫筆
	private Paint textPaint1;// 高低文字的畫筆
	private float mColorWheelRadius;// 圓圈通俗狀況下的半徑
	private float circleStrokeWidth;// 圓圈的線條粗細(xì)
	private float pressExtraStrokeWidth;// 按下狀況下增長的圓圈線條增長的粗細(xì)
	private int mText;// 中心文字內(nèi)容
	private int mCount;// 為了達(dá)到數(shù)字增長效不雅而添加的變量，他和mText其實(shí)代表一個(gè)意思
	private float mProgressAni;// 為了達(dá)到藍(lán)色扇形增長效不雅而添加的變量，他和mProgress其實(shí)代表一個(gè)意思
	private float mProgress;// 扇形弧度
	private int mTextSize;// 中心文字大年夜小
	private int mTextSize1;// 高低文字大年夜小
	private int mDistance;// 高低文字的距離
	BarAnimation anim;// 動畫類
	private int mType;// 根據(jù)傳入的數(shù)值斷定應(yīng)當(dāng)顯示的頁面

	public CircleBar(Context context) {
		super(context);
		init();
	}

	public CircleBar(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}

	public CircleBar(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	private void init() {

		circleStrokeWidth = dip2px(getContext(), 20);// 圓圈的線條粗細(xì)
		pressExtraStrokeWidth = dip2px(getContext(), 2);// 按下狀況下增長的圓圈線條增長的粗細(xì)
		mTextSize = dip2px(getContext(), 80);// 中心文字大年夜小
		mTextSize1 = dip2px(getContext(), 30);// 高低文字大年夜小
		mDistance = dip2px(getContext(), 70);//文字間的距離

		// 繪制藍(lán)色扇形的畫筆
		mColorWheelPaint = new Paint();
		mColorWheelPaint.setAntiAlias(true);// 抗鋸齒
		mColorWheelPaint.setColor(0xFF29a6f6);// 設(shè)制揭捉色
		mColorWheelPaint.setStyle(Paint.Style.STROKE);// 設(shè)置空心
		mColorWheelPaint.setStrokeWidth(circleStrokeWidth);// 設(shè)置圓圈粗細(xì)

		// 繪制底部灰色圓圈的畫筆
		mDefaultWheelPaint = new Paint();
		mDefaultWheelPaint.setAntiAlias(true);
		mDefaultWheelPaint.setColor(Color.parseColor("#d9d6c3"));
		mDefaultWheelPaint.setStyle(Paint.Style.STROKE);
		mDefaultWheelPaint.setStrokeWidth(circleStrokeWidth);

		// 中心文字的畫筆
		textPaint = new Paint(Paint.LINEAR_TEXT_FLAG);
		textPaint.setAntiAlias(true);
		textPaint.setColor(Color.parseColor("#6DCAEC"));
		textPaint.setStyle(Style.FILL_AND_STROKE);
		textPaint.setTextAlign(Align.LEFT);
		textPaint.setTextSize(mTextSize);

		// 高低文字的畫筆
		textPaint1 = new Paint(Paint.LINEAR_TEXT_FLAG);
		textPaint1.setAntiAlias(true);
		textPaint1.setColor(Color.parseColor("#a1a3a6"));
		textPaint1.setStyle(Style.FILL_AND_STROKE);
		textPaint1.setTextAlign(Align.LEFT);
		textPaint1.setTextSize(mTextSize1);

		// 中心文字內(nèi)容
		mText = 0;
		// 扇形弧度
		mProgress = 0;

		// 動畫類
		anim = new BarAnimation();
		anim.setDuration(1000);

	}

	@SuppressLint("DrawAllocation")
	@Override
	protected void onDraw(Canvas canvas) {
		int halfHeight = getHeight() / 2;
		int halfWidth = getWidth() / 2;
		int radius = halfHeight < halfWidth ? halfHeight : halfWidth;
		// 圓圈的矩形范圍 繪制底部灰色圓圈的畫筆
		canvas.drawCircle(halfWidth, halfHeight, radius - 20f,
				mDefaultWheelPaint);

		// mColorWheelRectangle是繪制藍(lán)色扇形的畫筆
		mColorWheelRectangle.top = halfHeight - radius + 20f;
		mColorWheelRectangle.bottom = halfHeight + radius - 20f;
		mColorWheelRectangle.left = halfWidth - radius + 20f;
		mColorWheelRectangle.right = halfWidth + radius - 20f;
		// 根據(jù)mProgressAni（角度）畫扇形
		canvas.drawArc(mColorWheelRectangle, -90, mProgressAni, false,
				mColorWheelPaint);
		Rect bounds = new Rect();
		String middleText = null;// 中心的文字
		String upText = null;// 膳綾擎文字
		String downText = null;// 底部文字

		if (this.mType == 1) {// 第一個(gè)頁面
			upText = "步數(shù)";
			downText = "目標(biāo):10000";
			middleText = String.valueOf(mCount);
		} else if (this.mType == 2) {// 第二個(gè)頁面
			upText = "卡路里";
			downText = "目標(biāo):10000";
			middleText = String.valueOf(mCount);
		} else if (this.mType == 3) {// 第三個(gè)頁面
			upText = "根據(jù)本身的須要填寫";
			downText = "3";
			middleText = "氣象";
		}
		// 中心文字的畫筆
		textPaint.getTextBounds(middleText, 0, middleText.length(), bounds);
		// drawText各個(gè)屬性的意思(文字,x坐標(biāo),y坐標(biāo),畫筆)
		canvas.drawText(middleText, (mColorWheelRectangle.centerX())
				- (textPaint.measureText(middleText) / 2),
				mColorWheelRectangle.centerY() + bounds.height() / 2, textPaint);
		textPaint1.getTextBounds(upText, 0, upText.length(), bounds);
		canvas.drawText(
				upText,
				(mColorWheelRectangle.centerX())
						- (textPaint1.measureText(upText) / 2),
				mColorWheelRectangle.centerY() + bounds.height() / 2
						- mDistance, textPaint1);
		textPaint1.getTextBounds(downText, 0, downText.length(), bounds);
		canvas.drawText(downText, (mColorWheelRectangle.centerX())
				- (textPaint1.measureText(downText) / 2),
				mColorWheelRectangle.centerY() + bounds.height() / 2
						+ mDistance, textPaint1);
	}

	// 測量父構(gòu)造的大年夜小
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		int height = getDefaultSize(getSuggestedMinimumHeight(),
				heightMeasureSpec);
		int width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);
		int min = Math.min(width, height);
		setMeasuredDimension(min, min);
		mColorWheelRadius = min - circleStrokeWidth - pressExtraStrokeWidth;

		// set辦法的參數(shù)意思：left,top,right,bottom
		mColorWheelRectangle.set(circleStrokeWidth + pressExtraStrokeWidth,
				circleStrokeWidth + pressExtraStrokeWidth, mColorWheelRadius,
				mColorWheelRadius);
	}

	// 對外的一個(gè)接口，用來開啟動畫
	public void startCustomAnimation() {
		this.startAnimation(anim);
	}

	// 中心的數(shù)值
	public void setText(int text) {
		mText = text;
		this.postInvalidate();// 可以用子線程更新視圖的辦法調(diào)用。
	}

	// 設(shè)置圓圈的進(jìn)度和圓圈所顯示的第幾個(gè)頁面
	public void setProgress(float progress, int mType) {
		mProgress = progress;
		this.mType = mType;
		this.postInvalidate();// 可以用子線程更新視圖的辦法調(diào)用。
	}

	/**
	 * 持續(xù)animation的一個(gè)動畫類
	 * 
	 * @author liyachao
	 *
	 */
	public class BarAnimation extends Animation {
		protected void applyTransformation(float interpolatedTime,
				Transformation t) {
			super.applyTransformation(interpolatedTime, t);
			if (interpolatedTime < 1.0f) {
				mProgressAni = interpolatedTime * mProgress;
				mCount = (int) (interpolatedTime * mText);
			} else {
				mProgressAni = mProgress;
				mCount = mText;
			}
			postInvalidate();

		}
	}

	public static int dip2px(Context context, float dipValue) {
		final float scale = context.getResources().getDisplayMetrics().density;
		return (int) (dipValue * scale + 0.5f);
	}

}

</pre><span style="white-space:pre"></span><p><span style="white-space:pre"><span style="font-size:18px"><span style="white-space:pre"><span style="font-size:18px; white-space:pre"><span style="white-space:pre">FragmentPedometer</span> 的</span><span style="font-size:18px; white-space:pre">代碼如下</span></span></span></span></p><p><span style="white-space:pre"><span style="font-size:18px"><span style="white-space:pre"><span style="font-size:18px; white-space:pre"></span></span></span></span></p><pre name="code" class="java">package com.example.histogram;

import com.example.changepage1.R;
import com.example.histogram.widet.CircleBar;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.View.OnClickListener;

/**
 * 這是記步的碎片
 * Author: 李埡超   email:[email protected]
 * Date: 2015-1-2
 * Time: 下晝2:39
 */
public class FragmentPedometer extends Fragment{
	private View view;
	private CircleBar circleBar;
	private int type = 1;//頁面類型
	//須要在handler里修改UI
	private Handler handler = new Handler() {
		public void handleMessage(android.os.Message msg) {
			if (type == 1) {
				circleBar.setProgress(270, 1);
				circleBar.setText(1000);
				circleBar.startCustomAnimation();
			} else if (type == 2) {
				circleBar.setProgress(180, 2);
				circleBar.setText(1500);
				circleBar.startCustomAnimation();
			} else if (type == 3) {
				circleBar.setProgress(360, 3);
				circleBar.startCustomAnimation();
			}
		};
	};

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		view = inflater.inflate(R.layout.pedometer, container, false);
		circleBar = (CircleBar) view.findViewById(R.id.circle);

		circleBar.setProgress(270, 1);
		circleBar.setText(1000);
		circleBar.startCustomAnimation();//開啟動畫
		circleBar.setOnClickListener(new OnClickListener() {
			public void onClick(View view) {
				if (type == 1) {
					type = 2;
				} else if (type == 2) {
					type = 3;
				} else if (type == 3) {
					type = 1;
				}
				Message msg = new Message();
				handler.sendMessage(msg);
			}
		});
		return view;
	}

}