Mazs's Notes

先看完成品:

先從改變顏色開始

1.先在drawable裡新增一個xml檔

內容如下(此例子為 drawable/processbar_style.xml ):

<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<!-- 設置背景圖檔 -->
<item android:id="@android:id/background" android:drawable="@drawable/progressbar_back" />

<!-- 設置progress條圖檔 -->
<item android:id="@android:id/progress" android:drawable="@drawable/progressbar_green" /> 

</layer-list>

2.然後在有ProcessBar 的layout裡設定

<ProgressBar
android:id="@+id/statistics_progressBar_green"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="150dip"
android:max="100"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/statistics_button_update"
android:layout_toRightOf="@+id/statistics_button_update"
android:progressDrawable="@drawable/processbar_style"
/>

(重點只有紅色那行)

那如果要動態設定多種顏色呢?

例如我想在不滿70%時綠色  70%-90% 黃色 90%以後紅色該怎麼設定?

因為如果在程式碼裡動態設定ProgressBar的setProgressDrawable屬性

會有樣式變奇怪的問題

所以參考了網路的方法 那就是 ....... 設多個ProcessBar!!!

然後程式中再動態將不要的progress隱藏

所以以我來說我需要3種變化

所以我在drawable裡新增了三個一樣的xml 只是裡面的Progress圖檔有換

三個分別叫做

processbar_style_green

processbar_style_yellow

processbar_style_red

然後在layout.xml裡新增三個重疊在一起的ProgressBar

<ProgressBar
android:id="@+id/statistics_progressBar_green"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="150dip"
android:max="100"
android:layout_height="wrap_content"
android:progressDrawable="@drawable/processbar_style_green"
/>

<ProgressBar
android:id="@+id/statistics_progressBar_yellow"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="150dip"
android:max="100"
android:layout_height="wrap_content"
android:progressDrawable="@drawable/processbar_style_yellow"
/>

<ProgressBar
android:id="@+id/statistics_progressBar_red"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="150dip"
android:max="100"
android:layout_height="wrap_content"
android:progressDrawable="@drawable/processbar_style_red"
/>

在程式中依照判斷內容動態設定哪個ProgressBar顯示

if((int)dischargeTemp>70&&(int)dischargeTemp<90){//大於70 轉黃色警告processBar
     

     processBar_Y.setProgress((int)dischargeTemp);
     processBar_G.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
     processBar_R.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
}else if((int)dischargeTemp>=90){//大於90 轉紅色警告processBar
     

     processBar_R.setProgress((int)dischargeTemp);
     processBar_Y.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
     processBar_G.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
}else{//剩下的綠色
     

     processBar_G.setProgress((int)dischargeTemp);
     processBar_Y.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
     processBar_R.setVisibility(4);//0可見, 4不可見 ,8不可見且不占用 布局空間
}