Ring progressBar在context裡如何使用?

woff

前篇 如何使用 ProgressBar 進度條(測試成功)
在MainActivity.java下測試是沒有問題的
但是多數會用到這，都不知道寫到第幾層了
這時就都會用context代替Activity了Google翻了許文章，也測試了不少
終於找到解法

Ring determinate ProgressBar
環型準確進度條完成圖

ProgressBar

layout/progress_ring.xml

1. <?xml version="1.0" encoding="utf-8"?>
   
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
3.     android:layout_width="match_parent"
   
4.     android:layout_height="match_parent"
   
5.     android:background="@android:color/white"
   
6.     android:orientation="vertical">
   
7.     <TextView
   
8.         android:id="@+id/progress_notice"
   
9.         android:layout_width="wrap_content"
   
10.         android:layout_height="wrap_content"
    
11.         android:textSize="30dp"
    
12.         android:layout_marginTop="20dp"
    
13.         android:textStyle="bold"
    
14.         android:textColor="@color/colorPrimaryBlue"
    
15.         />
    
16.     <ProgressBar
    
17.         android:id="@+id/progressBar"
    
18.         android:indeterminate="false"
    
19.         android:layout_width="250dp"
    
20.         android:layout_height="250dp"
    
21.         android:layout_centerInParent="true"
    
22.         android:progressDrawable="@drawable/progress_ring"
    
23.         style="@android:style/Widget.ProgressBar.Horizontal"/>
    
24.     <TextView
    
25.         android:id="@+id/txtprogress"
    
26.         android:layout_width="wrap_content"
    
27.         android:layout_height="wrap_content"
    
28.         android:layout_gravity="center"
    
29.         android:layout_centerInParent="true"
    
30.         android:textSize="30dp"
    
31.         android:textStyle="bold"
    
32.          />
    
33. </RelativeLayout>

複製代碼

res/drawable/progress_ring.xml

1. <?xml version="1.0" encoding="utf-8"?>
   
2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
   
3.     <item android:id="@android:id/secondaryProgress">
   
4.         <shape
   
5.             android:shape="ring"
   
6.             android:useLevel="true"
   
7.             android:innerRadiusRatio="3.5"
   
8.             android:thickness ="20dp">
   
9.             <corners android:radius="3dp"/>
   
10.             <solid android:color="#FA5858"/>
    
11.         </shape>
    
12.     </item>
    
13. 
    
14.     <item android:id="@android:id/progress">
    
15.         <shape
    
16.             android:shape="ring"
    
17.             android:useLevel="true"
    
18.             android:innerRadiusRatio="3.5"
    
19.             android:thickness ="20dp">
    
20.             <corners android:radius="3dp"/>
    
21.             <solid android:color="#0099CC"/>
    
22.         </shape>
    
23.     </item>
    
24. </layer-list>

複製代碼

在context下用進度條

1. 
   
2.         processingtitle      = (String) context.getText(R.string.processingtitle);
   
3.         processingcontext   = (String) context.getText(R.string.processingcontext);
   
4.       
   
5.         copytime =60000;
   
6.         pStatus = 0;
   
7.         handler = new Handler();
   
8.         /* set Activity progressBar into context */
   
9.         Activity a = (Activity) context;
   
10.         a.setContentView(R.layout.progress_ring);
    
11.         txtProgress = (TextView) ((Activity)context).findViewById(R.id.txtprogress);
    
12.         progressNotice = (TextView) ((Activity)context).findViewById(R.id.progress_notice);
    
13.         progressBar = (ProgressBar) ((Activity)context).findViewById(R.id.progressBar);
    
14. 
    
15.         /* progressBar count copytime transfer to percentage  */
    
16.         new Thread(new Runnable() {
    
17.             @Override
    
18.             public void run() {
    
19.                     progressBar.setVisibility(View.VISIBLE);
    
20.                     progressBar.setSecondaryProgress(100);
    
21.                     progressBar.setProgress(pStatus);
    
22.                     progressBar.setMax(100);
    
23.                     progressNotice.setText( processingtitle +" "+ processingcontext);
    
24.                     while (pStatus <= 100) {
    
25.                         handler.post(new Runnable() {
    
26.                             @Override
    
27.                             public void run() {
    
28.                                 progressBar.setProgress(pStatus);
    
29.                                 //Log.d("testpathi", "i="+pStatus + "  copytime:"+(copytime/100)*pStatus);
    
30.                                 txtProgress.setText(pStatus + " %");
    
31.                             }
    
32.                         });
    
33.                         try {
    
34.                             Thread.sleep(copytime/100);
    
35.                         } catch (InterruptedException e) {
    
36.                             e.printStackTrace();
    
37.                         }
    
38.                         pStatus++;
    
39.                     }
    
40.             }
    
41.         }).start();
    

複製代碼

這裡一定要用Handler，不用會無法更新


在這說明如何利用Shape畫出漸層的ProgressBar

以下為parameter說明：
Android 提供五種shape：rectangle(矩形)、oval(橢圓)、line(直線)、ring(圓環)。

而ProgressBar須選擇ring(圓環)。而當你使用ring後，會有以下五個parameter可使用
可參考以下這篇的解釋：[Shape Drawable的學習]

以下為此篇五個參數對五個參數的說明：

- innerRadiusRatio : 該值是以比例的形式來指定內圓半徑。內圓半徑等於該shape的寬除以該值。或者說該值的倒數代表了內圓半徑佔整個shape寬的比例。默認值是9。當該值等於2的時候，內圓就將佔滿整個shape，從而我們將看不到圓環。
- thicknessRatio : 以比例的形式來指定圓環的寬窄。其算法與innerRadiusRatio相同。
- useLevel : 值為true意味著這是一個levelListDrawable（關於levelListDrawable又是另一個話題了）。當我們要畫一個圓環是，應當而且必須將該值設為false，否則會看不到畫面。

這邊我是使用innerRadiusRatio與thicknessRatio此兩個參數來設定內環與外環的比率。當然亦可以全部使用。
最後一個參數android:useLevel，一定要設為false才可以看到畫面

gradient
- android:angle - 必須為45的倍數，0表示從左到右，90表示從上到下。
- android:endColor - 漸變結束的顏色
- android:startColor - 漸變開始的顏色
- android:centerColor - 漸變中間的顏色
- android:type - ["linear" | "radial" | "sweep"] 共有3種漸變類型，線性(default)、放射漸變、掃描式漸變，這邊我使用sweep

Android 提供的Shape真的可以用在很多地方，尤其是對custom view的部分，可以節省很多時間喔！





參考文章
https://segmentfault.com/a/1190000006700118
https://www.jianshu.com/p/38bd13e0ded8
https://stackoverflow.com/questions/10782344/displaying-progressbar-using-threading
https://segmentfault.com/a/1190000006700118
https://medium.com/@hsiangyu69/android-%E5%88%A9%E7%94%A8shape%E7%95%AB%E5%87%BA%E6%BC%B8%E5%B1%A4%E7%9A%84progressbar-a39fe0030569
https://blog.csdn.net/pingchuanyang/article/details/9230349
https://demonuts.com/circular-progress-bar/