Android ProgressBar分析及自定義ProgressBar

 

ProgressBar是在執行耗時操做時的一種人性化設計。分爲兩種形式：轉圈的，能顯示進度的。

而能取決因而什麼樣式的PregressBar,固然就是PregressBar的樣式啦~

Widget.ProgressBar.Horizontal  水平進度條
Widget.ProgressBar.Small　　　　小環形進度條
Widget.ProgressBar.Large　　　　大環形進度條
Widget.ProgressBar.Inverse　　　普通大小的環形進度條
Widget.ProgressBar.Small.Inverse　　小環形進度條
Widget.ProgressBar.Large.Inverse　　大環形進度條

首先講一下可以顯示進度的ProgressBar.
定義帶進度條的progressbar除了須要設置style之外還要設置一個最大值max，表示進度的結束值。
以下能夠經過xml來設置，除此以外還能夠在代碼中使用setMax來設置：

<!-- 定義一個水平進度條 -->
<ProgressBar
    android:id="@+id/bar"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:max="100"
    style="@android:style/Widget.ProgressBar.Horizontal"
    />

而後在使用的時候，在進度達到不一樣的狀況下，設置一下進度就能顯示相應的變化啦~

package org.crazyit.ui;


public class ProgressBarTest extends Activity
{
    // 該程序模擬填充長度爲100的數組
    private int[] data = new int[100];
    int hasData = 0;
    // 記錄ProgressBar的完成進度
    int status = 0;    
    ProgressBar bar;
    // 建立一個負責更新的進度的Handler
    Handler mHandler = new Handler()
    {
        @Override
        public void handleMessage(Message msg)
        {
            // 代表消息是由該程序發送的
            if (msg.what == 0x111)
            {
                bar.setProgress(status);//設置進度             }
        }
    };    
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        bar = (ProgressBar) findViewById(R.id.bar);
       // 啓動線程來執行任務
        new Thread()
        {
            public void run()
            {
                while (status < 100)
                {
                    // 獲取耗時操做的完成百分比
                    status = doWork();
                    // 發送消息
                    mHandler.sendEmptyMessage(0x111);
                }
            }
        }.start();
    }
    // 模擬一個耗時的操做
    public int doWork()
    {
        // 爲數組元素賦值
        data[hasData++] = (int) (Math.random() * 100);
        try
        {
            Thread.sleep(100);
        }
        catch (InterruptedException e)
        {
            e.printStackTrace();
        }
        return hasData;
    }
}

好吧，這些都是直接用的書裏的示例代碼。紅色代碼就是設置相應的進度啦~

代碼裏在線程中執行了模擬耗時操做dowork函數，固然最經常使用的是把dowork函數換成下載函數。

 

固然使用完畢咱們並不但願再看到他，這個時候調用一下

bar.setVisibility(View.GONE);

就好啦~

 

自定義ProgressBar

固然不少狀況，咱們是不大會用他們本來的樣式的，會自定義一下這些東西。

首先講一下環形進度條xml源碼。

<!-- 定義一個大環形進度條 -->
<ProgressBar
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    style="@android:style/Widget.ProgressBar.Large"
    />

看這個樣子，奧祕只能在style裏面，讓咱們進去看看~

<style name="Widget.ProgressBar.Large">
        <item name="android:indeterminateDrawable">@android:drawable/progress_large_white</item>
        <item name="android:minWidth">76dip</item>
        <item name="android:maxWidth">76dip</item>
        <item name="android:minHeight">76dip</item>
        <item name="android:maxHeight">76dip</item>
    </style>

這個地方長這個毛線樣，分別定義了圖片資源和寬高，那麼可想而知，咱們要改的是圖。而後再進@android:drawable/progress_large_white裏面去看一下~

這個時候已經沒有連接了，咱們直接去sdk裏找，具體位置是：D:\Java\android-sdk-windows\platforms\android-19\data\res\drawable

找progress_large_white.xml看一下。

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/spinner_black_76"
    android:pivotX="50%"
    android:pivotY="50%"
    android:framesCount="12"
    android:frameDuration="100" />

啊，原來是這樣的~咱們修改一下drawable不就得了，那來吧~

首先找一張圖片放進資源文件夾裏

而後寫一個上面那樣的animated-rotate，把android:drawable的值換成本身的圖片資源。

再而後就是寫一個style,把裏面的android:indeterminateDrawable的值換成本身寫的animated-rotate文件名。

再再而後就是在progressbar裏面的style的值換成本身寫的style，從新來一遍就是了~

 

 

而後再說一說水平進度條啦~

由於水平進度條有完成和沒完成之分，咱們自定義主要就是自定義這兩邊的樣子~

這個你就在progressbar裏面加一個progressDrawable。

<!-- 定義一個水平進度條，並改變軌道外觀 -->
<ProgressBar
    android:id="@+id/bar2"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:max="100"
    android:progressDrawable="@drawable/my_bar"
    style="@android:style/Widget.ProgressBar.Horizontal"/>

而後裏面須要放一個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/no" />
    <!-- 定義軌道上已完成部分的樣式 -->
    <item android:id="@android:id/progress"
        android:drawable="@drawable/ok" />
</layer-list>

而後你就找兩個圖放上去就好啦~

可是，這兩種自定義只是換下背景圖而已，基本的樣子仍是沒有發生什麼變化。其實咱們能夠作一個小動畫(好比韓寒的One裏面的那棵不斷生長的矢量樹用的就是逐幀動畫)，執行耗時操做的時候調用出來，執行完畢撤銷~