由於安卓應用很廣泛，在工業中也常有一些應用，比如可以用安卓來去工業中的一些數據進行實現的監測，顯示，同時可以做一些自動化控制，當然在這裡，我不是做這些自動化控制方面的研究，只是做一個控制項，液位指示，其實就是繼承自progressbar,然後重新寫一測量與繪製，算是對自定義控制項進行一下複習。 我們要做
由於安卓應用很廣泛，在工業中也常有一些應用，比如可以用安卓來去工業中的一些數據進行實現的監測，顯示，同時可以做一些自動化控制，當然在這裡，我不是做這些自動化控制方面的研究，只是做一個控制項，液位指示，其實就是繼承自progressbar,然後重新寫一測量與繪製，算是對自定義控制項進行一下複習。
我們要做的最終就是下麵這個效果：
在這裡，我們要做到對這個指示器的以下屬性可設置：
容器壁的厚度、容器壁的顏色、容器中液體的寬度、液體總高度、液體當前高度的顏色顯示、液體未達到顏色顯示、當前高度的文字指示、指示文字大小的顯示。
對以上屬性的可以設置，會使在實現應用中讓顯示更加直觀人性化。下麵就開始我們的指示器的製作。
1.先在項目的res目錄下建一個resouce文件，用來定義自定義的屬性，這些都會在下麵給出的源碼中給出，新人可以參考下，老家伙你就繞道吧^^：
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 郵箱:[email protected] 時間：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是對繪出的控制項將來占的空間進行的安排， */ @Override protected 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; } /** * 繪製控制項 */ @Override protected 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);
};
};
@Override
protected 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
