android-自訂控制項之液位指標，android-液位指標

android-自訂控制項之液位指標，android-液位指標

　　由於安卓應用很廣泛，在工業中也常有一些應用，比如可以用安卓來去工業中的一些資料進行實現的監測，顯示，同時可以做一些自動化控制，當然在這裡，我不是做這些自動化控制方面的研究，只是做一個控制項，液位指示，其實就是繼承自progressbar,然後重新寫一測量與繪製，算是對自訂控制項進行一下複習。

　　我們要做的最終就是下面這個效果：

在這裡，我們要做到對這個指標的以下屬性可設定：

容器壁的厚度、容器壁的顏色、容器中液體的寬度、液體總高度、液體當前高度的顏色顯示、液體未達到顏色顯示、當前高度的文字指示、指示文字大小的顯示。

對以上屬性的可以設定，會使在實現應用中讓顯示更加直觀人性化。下面就開始我們的指標的製作。

1 <?xml version="1.0" encoding="utf-8"?> 2 <resources> 3 4 <declare-styleable name="JianWWIndicateProgress"> 5 <attr name="progress_height" format="dimension" /> 6 <attr name="progress_width" format="dimension" /> 7 <attr name="progress_unreachedcolor" format="color" /> 8 <attr name="progress_reached_color" format="color" /> 9 <attr name="progress_reached_height" format="integer" />10 <attr name="progress_cheek_width" format="dimension" />11 <attr name="progress_cheek_color" format="color" />12 <attr name="progress_reached_textsize" format="dimension" />13 <attr name="progress_reached_textcolor" format="color" />14 </declare-styleable>15 16 </resources>

2.繼承progressbar,這裡繼承他主要是為了能夠用progressbar的getProgress()方法得到當前的progress,與setProgress()方法等progress中提供的一些方法，便於對資料的一些處理。

package com.jianww.firstview;import com.example.jwwcallback.R;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Style;import android.graphics.Rect;import android.util.AttributeSet;import android.util.TypedValue;import android.widget.ProgressBar;/** * 作者：jww 郵箱:bluejww@163.com 時間：2016年3月8日 */public class JianWWIndicateProgress extends ProgressBar {private static final int unreached_color = 0Xaa0000ff;// 未到達的顏色private static final int reached_color = 0Xaaff0000;// 到達顏色private static final int progress_height = 150;// 容器中液位的預設高度private static final int progress_width = 100;// 容器中液位的寬度private static final int reached_height = 60;// 預設到達到達的高度private static final int progress_cheek_width = 2;// 容器的邊框寬度private static final int progress_cheek_color = 0x660000ff;// 容器的邊框顏色private static final int progress_reached_textsize = 10;// 指示字型尺寸private static final int progress_reached_textcolor = 0Xff00ff00;// 指示字型顏色protected int unReachedColor;// 未到達的顏色protected int reachedColor;// 到達顏色protected int progressHeight;// 容器中液位的總高度protected int progressWidth;// 容器中液面的寬度protected int reachedHeight;// 預設液位到達的到達的高度protected int cheekWidth;// 容器的邊框寬度protected int cheekColor;// 容器的邊框顏色protected int reachedTextsize;// 指示字型尺寸protected int reachedTextcolor;// 指示字型顏色protected float widthZoom;protected float heightZoom;/** * dp 2 px * */protected int dp2px(int dpVal) {return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpVal, getResources().getDisplayMetrics());}/** * sp 2 px * */protected int sp2px(int spVal) {return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, spVal, getResources().getDisplayMetrics());}private Paint paintCheek = new Paint();private Paint paint = new Paint();private float radio;private float progressNowHeight;public JianWWIndicateProgress(Context context) {this(context, null);}public JianWWIndicateProgress(Context context, AttributeSet asets) {this(context, asets, 0);}public JianWWIndicateProgress(Context context, AttributeSet asets, int defStyle) {super(context, asets, defStyle);obtainStyledAttributes(asets);// paint.setTextSize(reachedTextsize);// paint.setColor(reachedTextcolor);}/** * 定義屬性 *  * @param asets屬性 */private void obtainStyledAttributes(AttributeSet asets) {final TypedArray typeArray = getContext().obtainStyledAttributes(asets, R.styleable.JianWWIndicateProgress);unReachedColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_unreachedcolor,unreached_color);reachedColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_reached_color, reached_color);// 到達顏色progressHeight = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_height,progress_height);progressWidth = dp2px((int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_width, progress_width));// 容器的總寬度reachedHeight = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_reached_height,reached_height);// 到達的高度cheekWidth = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_cheek_width,progress_cheek_width);// 容器的邊框寬度cheekColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_cheek_color, progress_cheek_color);reachedTextsize = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_reached_textsize,progress_reached_textsize);// 指示字型尺寸reachedTextcolor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_reached_textcolor,progress_reached_textcolor);// 指示字型顏色typeArray.recycle();}/** * onMeasure是對繪出的控制項將來占的空間進行的安排， */@Overrideprotected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);int totalWidth = measurdWidth(widthMeasureSpec);int totalHeight = measurdHeight(heightMeasureSpec);setMeasuredDimension(totalWidth, totalHeight);}/** * * @param widthMeasureSpec * @return 擷取寬度尺寸 */private int measurdWidth(int widthMeasureSpec) {int result = 0;int widthSpaceSize = MeasureSpec.getSize(widthMeasureSpec);int widthSpaceMode = MeasureSpec.getMode(widthMeasureSpec);if (widthSpaceMode == MeasureSpec.EXACTLY) {result = widthSpaceSize;widthZoom = widthSpaceSize/(progressWidth+2*cheekWidth);progressWidth = (int) (progressWidth * widthZoom);} else if (widthSpaceMode == MeasureSpec.UNSPECIFIED) {result = Math.max(widthSpaceSize, getPaddingLeft() + getPaddingRight() + progressWidth + 2 * cheekWidth);} else if (widthSpaceMode == MeasureSpec.AT_MOST) {result = Math.min(widthSpaceSize, getPaddingLeft() + getPaddingRight() + progressWidth + 2 * cheekWidth);}return result;}/** *  * @param heightMeasureSpec * @return擷取高度尺寸 */private int measurdHeight(int heightMeasureSpec) {int result = 0;int heightSpaceSize = MeasureSpec.getSize(heightMeasureSpec);int heightSpaceMode = MeasureSpec.getMode(heightMeasureSpec);if (heightSpaceMode == MeasureSpec.EXACTLY) {result = heightSpaceSize;heightZoom = heightSpaceSize/(progressHeight+2*cheekWidth);progressHeight = (int) (progressHeight*heightZoom);} else if (heightSpaceMode == MeasureSpec.UNSPECIFIED) {result = Math.max(heightSpaceSize, getPaddingTop() + getPaddingBottom() + progressHeight + 2 * cheekWidth);} else if (heightSpaceMode == MeasureSpec.AT_MOST) {result = Math.min(heightSpaceSize, getPaddingTop() + getPaddingBottom() + progressHeight + 2 * cheekWidth);}return result;}/** * 繪製控制項 */@Overrideprotected synchronized void onDraw(Canvas canvas) {super.onDraw(canvas);radio = getProgress() * 1.0f / getMax();progressNowHeight = (int) (progressHeight * radio);// 存繪畫前畫布狀態canvas.save();// 把畫布移動到要繪製的點canvas.translate(getPaddingLeft(), getPaddingRight());// 繪製容器外殼paintCheek.setColor(cheekColor);// 畫筆顏色paintCheek.setAntiAlias(true);// 是否過度paintCheek.setStyle(Style.STROKE);// 空心paintCheek.setStrokeWidth(cheekWidth);// 邊框的寬度canvas.drawRect(cheekWidth/2, cheekWidth/2, progressWidth + cheekWidth*3/2, progressHeight + cheekWidth*3/2,paintCheek);// 繪總液位paint.setColor(unReachedColor);paint.setStyle(Style.FILL);canvas.drawRect(cheekWidth, cheekWidth, progressWidth+cheekWidth, progressHeight+cheekWidth,paint);// 繪當前液位paint.setStyle(Style.FILL);paint.setColor(reachedColor);canvas.drawRect(cheekWidth, cheekWidth + progressHeight - progressNowHeight,progressWidth + cheekWidth, progressHeight + cheekWidth, paint);// 繪液位指示String text = getProgress() + "%";paint.setTextSize(reachedTextsize);paint.setColor(reachedTextcolor);float textHeight = sp2px(reachedTextsize)/2;if(progressNowHeight >= progressHeight/2){canvas.drawText(text, cheekWidth + progressWidth / 2, cheekWidth + progressHeight - progressNowHeight+textHeight, paint);}else{canvas.drawText(text, cheekWidth + progressWidth / 2, cheekWidth + progressHeight - progressNowHeight, paint);}canvas.restore();}}

　　3.就是在布局中的引用了

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    xmlns:jwwprogress="http://schemas.android.com/apk/res-auto"    xmlns:app="http://schemas.android.com/apk/res/com.example.jwwcallback"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:gravity="center" >    <com.jianww.firstview.JianWWIndicateProgress        android:id="@+id/jp_progress"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:max="100"        app:progress_cheek_color="#660000ff"        app:progress_cheek_width="4dp"        app:progress_height="160dp"        app:progress_reached_color="#ff0000"        app:progress_reached_textcolor="#000000"        app:progress_reached_textsize="12sp"        app:progress_unreachedcolor="#4400ff00"        app:progress_width="40dp" /></RelativeLayout>

　　4.就是在acitivity中的初始化與使用。

package com.example.jwwmain;import java.io.IOException;import java.net.HttpURLConnection;import java.net.MalformedURLException;import java.net.URL;import java.util.Random;import com.example.jwwcallback.R;import com.jianww.firstview.JianWWIndicateProgress;import android.app.Activity;import android.os.Bundle;import android.os.Handler;public class MainActivity extends Activity {private JianWWIndicateProgress jprogress;private int nowProgress;private Handler mHandler = new Handler() {public void handleMessage(android.os.Message msg) {int progress = jprogress.getProgress();jprogress.setProgress(++progress);if (progress >= 100) {jprogress.setProgress(0);}mHandler.sendEmptyMessageDelayed(100, 100);};};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();}private void initView() {jprogress = (JianWWIndicateProgress) findViewById(R.id.jp_progress);mHandler.sendEmptyMessage(100);}}

　　好了，寫的比較粗糙，有什麼大家可以一塊討論，功能可以實現，但有個別細節沒有處理好。^^

360雲端硬碟代碼分享：訪問密碼 9294