Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android 自定義UI--電池

Android 自定義UI--電池

編輯:關於Android編程

首先看一下效果圖,

\

下面看代碼:

/**
 * 
 */
package com.example.batterydemo;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;

/**
 * @author kince
 * @category 自定義View電池
 * @time 2014.2.13
 * @qq 543781062
 * 
 */
public class BatteryView extends View {

	/**
	 * 畫筆信息
	 */
	private Paint mBatteryPaint;
	private Paint mPowerPaint;
	private float mBatteryStroke = 2f;
	/**
	 * 屏幕高寬
	 */
	private int measureWidth;
	private int measureHeigth;
	/**
	 * 
	 * 電池參數
	 */
	private float mBatteryHeight = 30f; // 電池的高度
	private float mBatteryWidth = 60f; // 電池的寬度
	private float mCapHeight = 15f;
	private float mCapWidth = 5f;
	/**
	 * 
	 * 電池電量
	 */
	private float mPowerPadding = 1;
	private float mPowerHeight = mBatteryHeight - mBatteryStroke
			- mPowerPadding * 2; // 電池身體的高度
	private float mPowerWidth = mBatteryWidth - mBatteryStroke - mPowerPadding
			* 2;// 電池身體的總寬度
	private float mPower = 0f;
	/**
	 * 
	 * 矩形
	 */
	private RectF mBatteryRect;
	private RectF mCapRect;
	private RectF mPowerRect;

	public BatteryView(Context context) {
		super(context);
		initView();
	}

	public BatteryView(Context context, AttributeSet attrs) {
		super(context, attrs);
		initView();
	}

	public BatteryView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		initView();
	}

	public void initView() {
		/**
		 * 設置電池畫筆
		 */
		mBatteryPaint = new Paint();
		mBatteryPaint.setColor(Color.GRAY);
		mBatteryPaint.setAntiAlias(true);
		mBatteryPaint.setStyle(Style.STROKE);
		mBatteryPaint.setStrokeWidth(mBatteryStroke);
		/**
		 * 設置電量畫筆
		 */
		mPowerPaint = new Paint();
		mPowerPaint.setColor(Color.RED);
		mPowerPaint.setAntiAlias(true);
		mPowerPaint.setStyle(Style.FILL);
		mPowerPaint.setStrokeWidth(mBatteryStroke);
		/**
		 * 設置電池矩形
		 */
		mBatteryRect = new RectF(mCapWidth, 0, mBatteryWidth, mBatteryHeight);
		/**
		 * 設置電池蓋矩形
		 */
		mCapRect = new RectF(0, (mBatteryHeight - mCapHeight) / 2, mCapWidth,
				(mBatteryHeight - mCapHeight) / 2 + mCapHeight);
		/**
		 * 設置電量矩形
		 */
		mPowerRect = new RectF(mCapWidth + mBatteryStroke / 2 + mPowerPadding
				+ mPowerWidth * ((100f - mPower) / 100f), // 需要調整左邊的位置
				mPowerPadding + mBatteryStroke / 2, // 需要考慮到 畫筆的寬度
				mBatteryWidth - mPowerPadding * 2, mBatteryStroke / 2
						+ mPowerPadding + mPowerHeight);
	}

	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		canvas.save();
		canvas.translate(measureWidth / 2, measureHeigth / 2);
		canvas.drawRoundRect(mBatteryRect, 2f, 2f, mBatteryPaint); // 畫電池輪廓需要考慮 畫筆的寬度
		canvas.drawRoundRect(mCapRect, 2f, 2f, mBatteryPaint);// 畫電池蓋
		canvas.drawRect(mPowerRect, mPowerPaint);// 畫電量
		canvas.restore();
	}
	
	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		measureWidth = MeasureSpec.getSize(widthMeasureSpec);
		measureHeigth = MeasureSpec.getSize(heightMeasureSpec);
		setMeasuredDimension(measureWidth, measureHeigth);
	}

	/**]
	 * @category 設置電池電量
	 * @param power
	 */
	public void setPower(float power) {
		mPower = power;
		if (mPower < 0) {
			mPower = 0;
		}
		mPowerRect = new RectF(mCapWidth + mBatteryStroke / 2 + mPowerPadding
				+ mPowerWidth * ((100f - mPower) / 100f), // 需要調整左邊的位置
				mPowerPadding + mBatteryStroke / 2, // 需要考慮到 畫筆的寬度
				mBatteryWidth - mPowerPadding * 2, mBatteryStroke / 2
						+ mPowerPadding + mPowerHeight);
		invalidate();
	}

}
代碼已經注釋得比較清楚了,大家自己看吧,不懂的方法可以去看一下api。

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved