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里面的那棵不断生长的矢量树用的就是逐帧动画)，执行耗时操做的时候调用出来，执行完毕撤销~