1. 程式人生 > >android圓形進度條ProgressBar顏色設定

android圓形進度條ProgressBar顏色設定

Java程式碼
  1. <ProgressBar
  2.         android:id="@+id/loadProgressBar"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:indeterminateDrawable="@drawable/progressbar" />
複製程式碼 其中的indeterminteDrawable屬性就是用來設定進度條顏色等屬性的,其內容如下:
Java程式碼
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <rotate xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:fromDegrees="0"
  4.     android:pivotX="50%"
  5.     android:pivotY="50%"
  6.     android:toDegrees="360" >
  7.     <shape
  8.         android:innerRadiusRatio="3"
  9.         android:shape="ring"
  10.         android:thicknessRatio="8"
  11.         android:useLevel="false" >
  12.         <gradient
  13.             android:centerColor="#FFFFFF"
  14.             android:centerY="0.50"
  15.             android:endColor="#FFFF00"
  16.             android:startColor="#000000"
  17.             android:type="sweep"
  18.             android:useLevel="false" />
  19.     </shape>
  20. </rotate>
複製程式碼 三種方式實現自定義圓形頁面載入中效果的進度條:
來自:
http://407827531.iteye.com/blog/1067025


預設情況下Indeterminate Progressbar是白色的,如果容器的背景也是白色的,這樣就根本看不到Progressbar了。

幸好Android自帶了一些反轉樣式,你可以採用其中一個合適的:
Java程式碼
  1. <ProgressBar style="@android:style/Widget.ProgressBar.Inverse"/>
  2. <ProgressBar style="@android:style/Widget.ProgressBar.Large.Inverse"/>
  3. <ProgressBar style="@android:style/Widget.ProgressBar.Small.Inverse"/>
複製程式碼 進度條:

Java程式碼
  1. <ProgressBar
  2.         style="?android:attr/progressBarStyleHorizontal"
  3.         android:layout_width="fill_parent"
  4.         android:layout_height="wrap_content" />
  5. <ProgressBar
  6.         android:id="@+id/circleProgressBar"
  7.         style="?android:attr/progressBarStyleLarge"
  8.         android:layout_width="wrap_content"
  9.         android:layout_height="wrap_content"
  10.         mce_style="?android:attr/progressBarStyleLarge" />
複製程式碼 一、通過動畫實現
定義res/anim/loading.xml如下:
Java程式碼
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <animation-list xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:oneshot="false" >
  4.     <item
  5.         android:drawable="@drawable/loading_01"
  6.         android:duration="150"/>
  7.     <item
  8.         android:drawable="@drawable/loading_02"
  9.         android:duration="150"/>
  10.     <item
  11.         android:drawable="@drawable/loading_03"
  12.         android:duration="150"/>
  13.     <item
  14.         android:drawable="@drawable/loading_04"
  15.         android:duration="150"/>
  16.     <item
  17.         android:drawable="@drawable/loading_05"
  18.         android:duration="150"/>
  19.     <item
  20.         android:drawable="@drawable/loading_06"
  21.         android:duration="150"/>
  22.     <item
  23.         android:drawable="@drawable/loading_07"
  24.         android:duration="150"/>
  25. </animation-list>
複製程式碼 在layout檔案中引用如下:
Java程式碼
  1. <ProgressBar
  2.         android:id="@+id/loading_process_dialog_progressBar"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:indeterminate="false"
  6.         android:indeterminateDrawable="@anim/loading" />
複製程式碼 二、通過自定義顏色實現
定義res/drawable/dialog_style_xml_color.xml如下:
Java程式碼
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <rotate xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:fromDegrees="0"
  4.     android:pivotX="50%"
  5.     android:pivotY="50%"
  6.     android:toDegrees="360" >
  7.     <shape
  8.         android:innerRadiusRatio="3"
  9.         android:shape="ring"
  10.         android:thicknessRatio="8"
  11.         android:useLevel="false" >
  12.         <gradient
  13.             android:centerColor="#FFDC35"
  14.             android:centerY="0.50"
  15.             android:endColor="#CE0000"
  16.             android:startColor="#FFFFFF"
  17.             android:type="sweep"
  18.             android:useLevel="false" />
  19.     </shape>
  20. </rotate>
複製程式碼 在layout檔案中引用如下:
Java程式碼
  1. <ProgressBar
  2.         android:id="@+id/loading_process_dialog_progressBar"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:indeterminate="false"
  6.         android:indeterminateDrawable="@drawable/dialog_style_xml_color" />
複製程式碼 三、使用一張圖片進行自定義
定義res/drawable/dialog_style_xml_icon.xml如下:
Java程式碼
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
  3.     <item>
  4.         <rotate
  5.             android:drawable="@drawable/dialog_progress_round"
  6.             android:fromDegrees="0.0"
  7.             android:pivotX="50.0%"
  8.             android:pivotY="50.0%"
  9.             android:toDegrees="360.0" />
  10.     </item>
  11. </layer-list>
複製程式碼 在layout檔案中引用如下:
Java程式碼
  1. <ProgressBar
  2.         android:id="@+id/loading_process_dialog_progressBar"
  3.         android:layout_width="wrap_content"
  4.         android:layout_height="wrap_content"
  5.         android:indeterminate="false"
  6.         android:indeterminateDrawable="@drawable/dialog_style_xml_icon" />
複製程式碼 或者
Java程式碼
  1. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  2.    <item android:id="@android:id/background">   
  3.     <shape>   
  4.         <corners android:radius="5dip" />   
  5.         <gradient android:startColor="#ff9d9e9d"   
  6.              android:centerColor="#ff5a5d5a"   
  7.              android:centerY="0.75"   
  8.              android:endColor="#ff747674"   
  9.              android:angle="270"   
  10.              />   
  11.     </shape>   
  12. </item>   
  13. <item android:id="@android:id/secondaryProgress">   
  14.     <clip>   
  15.         <shape>   
  16.             <corners android:radius="5dip" />   
  17.             <gradient android:startColor="#80ffd300"   
  18.                  android:centerColor="#80ffb600"   
  19.                  android:centerY="0.75"   
  20.                  android:endColor="#a0ffcb00"   
  21.                  android:angle="270"   
  22.                 />   
  23.         </shape>   
  24.     </clip>   
  25. </item>   
  26. <item android:id="@android:id/progress">   
  27.     <clip>   
  28.         <shape>   
  29.             <corners android:radius="5dip" />   
  30.             <gradient android:startColor="@color/progress_start"   
  31.                 android:endColor="@color/progress_end"   
  32.                 android:angle="270" />   
  33.         </shape>   
  34.     </clip>   
  35. </item>
  36. </layer-list>
複製程式碼 程式碼中設定:
Java程式碼
  1. mProgress = (ProgressBar) findViewById(R.id.progress_bar);
  2.                 Drawable d = this.getResources().getDrawable(R.drawable.my_progress);
  3.                 mProgress.setProgressDrawable(d);
複製程式碼