花樣Android ProgressBar史上最強大講解 – Android移動開發技術文章_手機開發 Android移動開發教學課程

多式樣ProgressBar

普通圓形ProgressBar

 

 

該類型進度條也就是一個表示運轉的過程,例如發送短信,連接網絡等等,表示一個過程正在執行中。

一般隻要在XML佈局中定義就可以瞭。
Java代碼 
01.<progressBar android:id="@+id/widget43" 
 
02.      android:layout_width="wrap_content"  
 
03.      android:layout_height="wrap_content"     
 
04.      android:layout_gravity="center_vertical"> 
05.</ProgressBar>
此時,沒有設置它的風格,那麼它就是圓形的,一直會旋轉的進度條。

各大小樣式圓形ProgressBar


超大號圓形ProgressBar


此時,給設置一個style風格屬性後,該ProgressBar就有瞭一個風格,這裡大號ProgressBar的風格是:
Java代碼 
01.style="?android:attr/progressBarStyleLarge" 
完整XML定義是: 
01.<progressBar android:id="@+id/widget196" 
 
02.      android:layout_width="wrap_content"  
 
03.      android:layout_height="wrap_content" 
 
04.      style="?android:attr/progressBarStyleLarge"> 

05.</ProgressBar>

小號圓形ProgressBar

 

小號ProgressBar對應的風格是:
01.style="?android:attr/progressBarStyleSmall"
復制代碼完整XML定義是:
Java代碼 
01.<progressBar android:id="@+id/widget108" 
 
02.      android:layout_width="wrap_content"  
 
03.      android:layout_height="wrap_content" 
 
04.      style="?android:attr/progressBarStyleSmall"> 
 
05.</ProgressBar> 

標題型圓形ProgressBar

 

 

標題型ProgressBar對應的風格是:
01.style="?android:attr/progressBarStyleSmallTitle"
完整XML定義是:
Java代碼 
01.<progressBar android:id="@+id/widget110" 
 
02.    android:layout_width="wrap_content"  
 
03.    android:layout_height="wrap_content" 
 
04.    style="?android:attr/progressBarStyleSmallTitle"> 
 
05.</ProgressBar> 
代碼中實現:
Java代碼 
01.@Override 
 
02.    protected void onCreate(Bundle savedInstanceState) { 
 
03.        // TODO Auto-generated method stub 
 
04.        super.onCreate(savedInstanceState); 
 
05.        requestWindowFeature(Window.FEATURE_INDETERMINATE_PROGRESS); 
 
06.        //請求窗口特色風格,這裡設置成不明確的進度風格 
 
07.        setContentView(R.layout.second); 
 
08.        setProgressBarIndeterminateVisibility(true); 
 
09.        //設置標題欄中的不明確的進度條是否可以顯示 
 
10.    } 
長形進度條

佈局中的長形進度條


①首先在XML進行佈局
Java代碼 
01.<progressBar android:id="@+id/progressbar_updown" 
 
02.        android:layout_width="200dp"  
 
03.        android:layout_height="wrap_content" 
 
04.        style="?android:attr/progressBarStyleHorizontal" 
 
05.        android:layout_gravity="center_vertical"  
 
06.        android:max="100" 
 
07.        android:progress="50" 
 
08.        android:secondaryProgress="70"    >  
講解: 
style="?android:attr/progressBarStyleHorizontal"    
 設置風格為長形  
  
android:max="100"    
 最大進度值為100  
android:progress="50"   
 初始化的進度值  
android:secondaryProgress="70"  
 初始化的底層第二個進度值  
  
android:layout_gravity="center_vertical"    
 垂直居中  

②代碼中運用
Java代碼 
01.private ProgressBar myProgressBar; 
 
02.//定義ProgressBar 
 
03.myProgressBar = (ProgressBar) findViewById(R.id.progressbar_updown); 
 
04.//ProgressBar通過ID來從XML中獲取 
 
05.myProgressBar.incrementProgressBy(5); 
 
06.//ProgressBar進度值增加5 
 
07.myProgressBar.incrementProgressBy(-5); 
 
08.//ProgressBar進度值減少5 
 
09.myProgressBar.incrementSecondaryProgressBy(5); 
 
10.//ProgressBar背後的第二個進度條 進度值增加5 
 
11.myProgressBar.incrementSecondaryProgressBy(-5); 
 
12.//ProgressBar背後的第二個進度條 進度值減少5 

頁面標題中的長形進度條


代碼實現:
①先設置一下窗口風格特性
Java代碼 
01.requestWindowFeature(Window.FEATURE_PROGRESS); 
 
02.//請求一個窗口進度條特性風格 
 
03.setContentView(R.layout.main); 
 
04.setProgressBarVisibility(true); 
 
05.//設置進度條可視 
復制代碼②然後設置進度值
Java代碼 
01.setProgress(myProgressBar.getProgress() * 100); 
 
02.//設置標題欄中前景的一個進度條進度值 
 
03.setSecondaryProgress(myProgressBar.getSecondaryProgress() * 100); 
 
04.//設置標題欄中後面的一個進度條進度值 
 
05.//ProgressBar.getSecondaryProgress() 是用來獲取其他進度條的進度值 

ProgressDialog

ProgressDialog中的圓形進度條
     
ProgressDialog一般用來表示一個系統任務或是開啟任務時候的進度,有一種稍等的意思。
代碼實現:

Java代碼 
01.  ProgressDialog mypDialog=new ProgressDialog(this); 
 
02.            //實例化 
 
03.            mypDialog.setProgressStyle(ProgressDialog.STYLE_SPINNER); 
 
04.            //設置進度條風格,風格為圓形,旋轉的 
 
05.            mypDialog.setTitle("Google"); 
 
06.            //設置ProgressDialog 標題 
 
07.            mypDialog.setMessage(getResources().getString(R.string.second)); 
 
08.            //設置ProgressDialog 提示信息 
 
09.            mypDialog.setIcon(R.drawable.android); 
 
10.            //設置ProgressDialog 標題圖標 
 
11.            mypDialog.setButton("Google",this); 
 
12.            //設置ProgressDialog 的一個Button 
 
13.            mypDialog.setIndeterminate(false); 
 
14.            //設置ProgressDialog 的進度條是否不明確 
 
15.            mypDialog.setCancelable(true); 
 
16.            //設置ProgressDialog 是否可以按退回按鍵取消 
 
17.            mypDialog.show(); 
 
18.            //讓ProgressDialog顯示 
ProgressDialog中的長形進度條
     

代碼實現:
Java代碼 
01.ProgressDialog mypDialog=new ProgressDialog(this); 
 
02.//實例化 
 
03.            mypDialog.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL); 
 
04.            //設置進度條風格,風格為長形,有刻度的 
 
05.            mypDialog.setTitle("地獄怒獸"); 
 
06.            //設置ProgressDialog 標題 
 
07.            mypDialog.setMessage(getResources().getString(R.string.second)); 
 
08.            //設置ProgressDialog 提示信息 
 
09.            mypDialog.setIcon(R.drawable.android); 
 
10.            //設置ProgressDialog 標題圖標 
 
11.            mypDialog.setProgress(59); 
 
12.            //設置ProgressDialog 進度條進度 
 
13.            mypDialog.setButton("地獄曙光",this); 
 
14.            //設置ProgressDialog 的一個Button 
 
15.            mypDialog.setIndeterminate(false); 
 
16.            //設置ProgressDialog 的進度條是否不明確 
 
17.            mypDialog.setCancelable(true); 
 
18.            //設置ProgressDialog 是否可以按退回按鍵取消 
 
19.            mypDialog.show(); 
 
20.            //讓ProgressDialog顯示 
   


AlertDialog.Builder

AlertDialog中的圓形ProgressBar

①先來設計一個Layout,待會兒作為一個View,加入AlertDialog.Builder
Java代碼 
01.<?xml version="1.0" encoding="utf-8"?> 
 
02.<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 
03.    android:layout_gravity="center_horizontal"  
 
04.    android:layout_width="wrap_content" 
 
05.    android:layout_height="wrap_content"> 
 
06.    <LinearLayout android:id="@+id/LinearLayout01" 
 
07.    android:layout_width="wrap_content"  
 
08.    android:layout_height="wrap_content"> 
 
09.</LinearLayout> 
 
10.    <ProgressBar android:layout_gravity="center_vertical|center_horizontal" 
 
11.        android:layout_height="wrap_content"  
 
12.        android:progress="57" 
 
13.        android:id="@+id/myView_ProgressBar2"  
 
14.        android:layout_width="wrap_content"> 
 
15.</ProgressBar> 
 
16.</LinearLayout> 
②代碼羅
Java代碼 
01.private AlertDialog.Builder AlterD,AlterD2; 
 
02.//定義提示對話框 
 
03.private LayoutInflater layoutInflater; 
 
04.//定義佈局過濾器 
 
05.private LinearLayout myLayout; 
 
06.//定義佈局 
 
07.layoutInflater2=(LayoutInflater) getSystemService(this.LAYOUT_INFLATER_SERVICE); 
 
08.//獲得系統的佈局過濾服務 
 
09.myLayout2=(LinearLayout) layoutInflater2.inflate(R.layout.roundprogress, null); 
 
10.//得到事先設計好的佈局 
 
11.AlterD2.setTitle(getResources().getString(R.string.RoundO)); 
 
12.//設置對話框標題 
 
13.AlterD2.setIcon(R.drawable.ma); 
 
14.//設置對話框圖標 
 
15.AlterD2.setMessage(getResources().getString(R.string.ADDView)); 
 
16.//設置對話框提示信息 
 
17.AlterD2.setView(myLayout2); 
 
18.//設置對話框中的View 
 
19.AlterD2.show(); 
 
20.//讓對話框顯示 
AlertDialog中的長形ProgressBar(可控制)

①先來設計一個Layout,待會兒作為一個View,加入AlertDialog.Builder
Java代碼 
01.<?xml version="1.0" encoding="utf-8"?> 
 
02.<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 
03.    android:layout_gravity="center_horizontal"  
 
04.android:layout_width="wrap_content" 
 
05.    android:layout_height="wrap_content"> 
 
06.    <Button  
 
07.android:layout_height="wrap_content"  
 
08.android:text="-" 
 
09.        android:layout_width="50dp"  
 
10.android:id="@+id/myView_BT_Down"> 
 
11.</Button> 
 
12.    <ProgressBar  
 
13.android:layout_gravity="center_vertical" 
 
14.        android:layout_height="wrap_content"  
 
15.style="?android:attr/progressBarStyleHorizontal" 
 
16.        android:id="@+id/myView_ProgressBar"  
 
17.android:progress="57" 
 
18.        android:layout_width="178dp"> 
 
19.</ProgressBar> 
 
20.    <Button android:layout_height="wrap_content"  
 
21.android:text="+" 
 
22.        android:layout_width="50dp"  
 
23.android:id="@+id/myView_BT_Up"> 
 
24.</Button> 
 
25.</LinearLayout> 
②代碼羅
Java代碼 
01.private AlertDialog.Builder AlterD,AlterD2; 
 
02.//定義提示對話框 
 
03.private LayoutInflater layoutInflater; 
 
04.//定義佈局過濾器 
 
05.private LinearLayout myLayout; 
 
06.//定義佈局 
 
07.layoutInflater=(LayoutInflater) getSystemService(this.LAYOUT_INFLATER_SERVICE); 
 
08.//獲得系統的佈局過濾服務 
 
09.myLayout=(LinearLayout) layoutInflater.inflate(R.layout.myview, null); 
 
10.//得到事先設計好的佈局 
 
11. 
 
12.myup=(Button) myLayout.findViewById(R.id.myView_BT_Up); 
 
13.mydown=(Button) myLayout.findViewById(R.id.myView_BT_Down); 
 
14.mypro=(ProgressBar)myLayout.findViewById(R.id.myView_ProgressBar); 
 
15.//通過myLayout.findViewById來獲取自定義View中的Widget控件元素 
 
16. 
 
17.myup.setOnClickListener(this); 
 
18.//設置對話框View中的按鈕監聽器 
 
19.mydown.setOnClickListener(this); 
 
20.//設置對話框View中的按鈕監聽器 
 
21.mypro.setProgress(Tag); 
 
22.//設置一個Tag作為進度值 
 
23.AlterD.setTitle(getResources().getString(R.string.RectO)); 
 
24.//設置對話框標題 
 
25.AlterD.setIcon(R.drawable.mb); 
 
26.//設置對話框圖標 
 
27.AlterD.setMessage(getResources().getString(R.string.ADDView)); 
 
28.//設置對話框提示信息 
 
29.AlterD.setView(myLayout); 
 
30.//設置對話框添加的View 
 
31.AlterD.setPositiveButton("OK", new DialogInterface.OnClickListener(){ 
 
32.    @Override 
 
33.    public void onClick(DialogInterface dialog, int which) { 
 
34.        // TODO Auto-generated method stub 
 
35.        MyProgressBar.Tag=mypro.getProgress(); 
 
36.    }}); 
 
37.//設置對話框按鈕,以及按鈕的事件監聽器 
 
38.AlterD.show(); 
 
39.//讓對話框顯示 
復制代碼③進度條進度值的按鈕事件
Java代碼 
01.myup.setOnClickListener(this); 
 
02.//設置對話框View中的按鈕監聽器 
 
03.mydown.setOnClickListener(this); 
 
04.//設置對話框View中的按鈕監聽器 
 
05.對應的代碼: 
 
06.    @Override 
 
07.    public void onClick(View button) { 
 
08.        // TODO Auto-generated method stub 
 
09.        SwitchUPorDown(button); 
 
10.    } 
 
11. 
 
12.    private void SwitchUPorDown(View button) { 
 
13.        switch (button.getId()) { 
 
14.                case R.id.myView_BT_Up: { 
 
15.            mypro.incrementProgressBy(1);     
 
16.        } 
 
17.            break; 
 
18.        case R.id.myView_BT_Down: { 
 
19.            mypro.incrementProgressBy(-1); 
 
20.        } 
 
21.            break; 
 
22.        default: 
 
23.            break; 
 
24.        } 
 
25.    } 
App Widget中的進度條


Widget中的圓形ProgressBar

這個很簡單,在Widget中沒有多大意思,不再敷述。

Widget中的長形ProgressBar(可控制)

Widget的實現就不再重復,假設您已經把Widget佈局,相應設置已經設置好瞭。也可以在桌面加入類似上面圖中的樣式。
現在我們來實現一下按鈕事件,與進度條的交互。
下面還是簡單講解一下Widget的設計與部署。


①設計Widget佈局
Java代碼 
01.<?xml version="1.0" encoding="utf-8"?> 
 
02.<LinearLayout  
 
03.    xmlns:android="http://schemas.android.com/apk/res/android" 
 
04.    android:background="@drawable/widget"  
 
05.    android:layout_height="74dp"  
 
06.    android:layout_width="296dp"> 
 
07.    <Button  
 
08.        android:layout_height="wrap_content"  
 
09.        android:text="-"  
 
10.        android:layout_gravity="center_vertical" 
 
11.        android:layout_width="50dp"  
 
12.        android:id="@+id/widget_BT_Down"  
 
13.        android:layout_marginLeft="10dp"> 
 
14.    </Button> 
 
15.    <ProgressBar  
 
16.        android:layout_gravity="center_vertical" 
 
17.        android:layout_height="wrap_content"  
 
18.        style="?android:attr/progressBarStyleHorizontal" 
 
19.        android:layout_width="178dp"  
 
20.        android:id="@+id/widget_ProgressBar"> 
 
21.   </ProgressBar> 
 
22.    <Button  
 
23.        android:layout_height="wrap_content"  
 
24.        android:text="+"  
 
25.        android:layout_gravity="center_vertical" 
 
26.        android:layout_width="50dp"  
 
27.        android:id="@+id/widget_BT_Up"> 
 
28.   </Button> 
 
29.</LinearLayout> 
②新增一個.res/xml目錄,加入appwidget-provider
Java代碼 
01.<?xml version="1.0" encoding="utf-8"?> 
 
02.<appwidget-provider  
 
03.    xmlns:android="http://schemas.android.com/apk/res/android" 
 
04.    android:initialLayout="@layout/widgetlayout" 
 
05.    android:updatePeriodMillis="8660000"  
 
06.    android:minWidth="296dp" 
 
07.    android:minHeight="74dp"> 
08.</appwidget-provider>
③實現一個AppWidgetProvider子類
Java代碼 
01.package zyf.test.ProgressBar; 
 
02.import android.appwidget.AppWidgetManager; 
 
03.import android.appwidget.AppWidgetProvider; 
 
04.import android.content.Context; 
 
05.import android.content.Intent; 
 
06. 
 
07.public class App extends AppWidgetProvider { 
 
08. 
 
09.    @Override 
 
10.    public void onEnabled(Context context) { 
 
11.        // TODO Auto-generated method stub 
 
12.        super.onEnabled(context); 
 
13.    } 
 
14. 
 
15.    @Override 
 
16.    public void onReceive(Context context, Intent intent) { 
 
17.        // TODO Auto-generated method stub 
 
18.        super.onReceive(context, intent); 
 
19.    } 
 
20. 
 
21.    @Override 
 
22.    public void onUpdate(Context context, AppWidgetManager appWidgetManager, 
 
23.            int[] appWidgetIds) { 
 
24.        // TODO Auto-generated method stub 
 
25.        super.onUpdate(context, appWidgetManager, appWidgetIds); 
 
26.    } 
 
27. 
 
28.} 
④配置Manifest,進行註冊
Java代碼 
01.<receiver android:name="AppWidget"> 
 
02.    <intent-filter> 
 
03.    <action android:name="android.appwidget.action.APPWIDGET_UPDATE"></action> 
 
04.    </intent-filter> 
 
05.    <meta-data   
 
06.        android:resource="@xml/appwidget"  
 
07.        android:name="android.appwidget.provider"> 
 
08.    </meta-data> 
 
09.</receiver> 
這裡實現按鈕與進度條的交互。(Widget自己廣播發送與接收)

①按鈕的消息發送
Java代碼 
01.@Override 
 
02.    public void onUpdate(Context context, AppWidgetManager appWidgetManager, 
 
03.            int[] appWidgetIds) { 
 
04.        // TODO Auto-generated method stub 
 
05.        final int N = appWidgetIds.length; 
 
06. 
 
07.        // Perform this loop procedure for each App Widget that belongs to this provider 
 
08.        for (int i=0; i<N; i++) { 
 
09.            int appWidgetId = appWidgetIds; 
 
10.            RemoteViews views= 
 
11.new RemoteViews(context.getPackageName(), R.layout.widgetlayout); 
 
12.             
 
13.            Intent UPintent=new Intent("zyf.test.widget.UP"); 
 
14.            Intent DOWNintent=new Intent("zyf.test.widget.DOWN"); 
 
15.            //實例化 兩個帶有Action的Intent 
 
16.            PendingIntent pendingIntentUp 
 
17.=PendingIntent.getBroadcast(context, 0, UPintent, 0); 
 
18.            PendingIntent pendingIntentDown 
 
19.=PendingIntent.getBroadcast(context, 0, DOWNintent, 0); 
 
20.            //實例化兩個以Intent來構造的PendingIntent 
 
21.            views.setOnClickPendingIntent(R.id.widget_BT_Up, pendingIntentUp); 
 
22.            views.setOnClickPendingIntent(R.id.widget_BT_Down, pendingIntentDown); 
 
23.            //給View上的兩個按鈕綁定事件,這裡是廣播消息的發送 
 
24.            appWidgetManager.updateAppWidget(appWidgetId, views); 
 
25.        } 
 
26.    } 
②Widget自身消息接收,使用intent.getAction()來獲取Action
Java代碼 
01.@Override 
 
02.    public void onReceive(Context context, Intent intent) { 
 
03.        // TODO Auto-generated method stub 
 
04.        super.onReceive(context, intent); 
 
05.        if(intent.getAction().equals("zyf.test.widget.UP")){ 
 
06.            Tag+=5; 
 
07.            if(Tag>100){ 
 
08.                Tag=100; 
 
09.            } 
 
10.            views.setProgressBar(R.id.widget_ProgressBar, 100, Tag, false); 
 
11.            appManager.updateAppWidget(thisWidget, views); 
 
12.        } 
 
13.        if(intent.getAction().equals("zyf.test.widget.DOWN")){ 
 
14.            Tag-=5; 
 
15.            if(Tag<0){ 
 
16.                Tag=0; 
 
17.            } 
 
18.            views.setProgressBar(R.id.widget_ProgressBar, 100, Tag, false); 
 
19.            appManager.updateAppWidget(thisWidget, views); 
 
20.        } 
 
21.    } 
③進度條的進度值設置
Java代碼 
01.views.setProgressBar(R.id.widget_ProgressBar, 100, Tag, false); 
 
02.//設置Widget上的進度條的進度值 
 
03.//第一個參數,Widget上進度條ID 
 
04.//第二個參數,進度條最大值 
 
05.//第三個參數Tag,一個int值,就是設置的進度值 
 
06.//第四個參數,是否是要進度條不確定 
復制代碼註意瞭,Widget自身的onReceive()方法如果要接收其他的Action廣播。那就必須在Manifest中,在Intent-filter中添加Action:
Java代碼 
01.<receiver android:name="AppWidget"> 
 
02.    <intent-filter> 
 
03.        <action android:name="android.appwidget.action.APPWIDGET_UPDATE"></action> 
 
04.                <action android:name="zyf.test.widget.UP"></action> 
 
05.                <action android:name="zyf.test.widget.DOWN"></action> 
 
06.    </intent-filter> 
 
07.    <meta-data 
 
08.        android:resource="@xml/appwidget" 
 
09.        android:name="android.appwidget.provider"> 
 
10.    </meta-data> 
 
11.</receiver> 

發佈留言