Android 應用開發（44）---ProgressBar(進度條)

ProgressBar(進度條)

1.常用屬性講解與基礎執行個體

從官方文檔，我們看到了這樣一個類關系圖：

ProgressBar繼承與View類，直接子類有AbsSeekBar和ContentLoadingProgressBar，其中AbsSeekBar的子類有SeekBar和RatingBar，可見這二者也是基于ProgressBar實作的

常用屬性詳解：

android:max：進度條的最大值

android:progress：進度條已完成進度值

android:progressDrawable：設定軌道對應的Drawable對象

android:indeterminate：如果設定成true，則進度條不精确顯示進度

android:indeterminateDrawable：設定不顯示進度的進度條的Drawable對象

android:indeterminateDuration：設定不精确顯示進度的持續時間

android:secondaryProgress：二級進度條，類似于視訊播放的一條是目前播放進度，一條是緩沖進度，前者通過progress屬性進行設定！

對應的再Java中我們可調用下述方法：

getMax()：傳回這個進度條的範圍的上限

getProgress()：傳回進度

getSecondaryProgress()：傳回次要進度

incrementProgressBy(int diff)：指定增加的進度

isIndeterminate()：訓示進度條是否在不确定模式下

setIndeterminate(boolean indeterminate)：設定不确定模式下

接下來來看看系統提供的預設的進度條的例子吧！

系統預設進度條使用執行個體：

運作效果圖：

Android 應用開發（44）---ProgressBar(進度條)

實作布局代碼：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <!-- 系統提供的圓形進度條,依次是大中小 -->

    <ProgressBar
        style="@android:style/Widget.ProgressBar.Small"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ProgressBar
        style="@android:style/Widget.ProgressBar.Large"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <!--系統提供的水準進度條-->
    <ProgressBar
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:max="100"
        android:progress="18" />

    <ProgressBar
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:indeterminate="true" />

</LinearLayout>

好吧，除了第二個能看，其他的就算了...系統提供的肯定是滿足不了我們的需求的！下面我們就來講解下實際開發中我們對進度條的處理！

2.使用動畫來替代圓形進度條

第一個方案是，使用一套連續圖檔，形成一個幀動畫，當需要進度圖的時候，讓動畫可見，不需要的時候讓動畫不可見即可！而這個動畫，一般是使用AnimationDrawable來實作的！好的，我們來定義一個AnimationDrawable檔案：

PS:用到的圖檔素材：進度條圖檔素材打包.zip

運作效果圖：

Android 應用開發（44）---ProgressBar(進度條)

實作步驟：

在res目錄下建立一個:anim檔案件，然後建立amin_pgbar.xml的資源檔案：

<?xml version="1.0" encoding="utf-8"?>  
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"  
    android:oneshot="false" >  
  
    <item  
        android:drawable="@drawable/loading_01"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_02"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_03"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_04"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_05"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_06"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_07"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_08"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_09"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_10"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_11"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/loading_12"  
        android:duration="200"/>  
  
</animation-list>

接着寫個布局檔案，裡面僅僅有一個ImageView即可，用于顯示進度條，把src設定為上述drawable資源即可！最後到MainActivity.java

public class MainActivity extends AppCompatActivity {

    private ImageView img_pgbar;
    private AnimationDrawable ad;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        img_pgbar = (ImageView) findViewById(R.id.img_pgbar);
        ad = (AnimationDrawable) img_pgbar.getDrawable();
        img_pgbar.postDelayed(new Runnable() {
            @Override
            public void run() {
                ad.start();
            }
        }, 100);
    }

}

這裡隻是寫了如何啟動動畫，剩下的就你自己來了哦~在需要顯示進度條的時候，讓ImageView可見；在不需要的時候讓他隐藏即可！另外其實Progressbar本身有一個indeterminateDrawable，隻需把這個參數設定成上述的動畫資源即可，但是進度條條的圖案大小是不能直接修改的，需要Java代碼中修改，如果你設定了寬高，而且這個寬高過大的時候，你會看到有多個進度條...自己權衡下吧~

3.自定義圓形進度條

相信你看完2會吐槽，卧槽，這麼坑爹，拿個動畫來坑人，哈哈，實際開發中都這樣，當然上述這種情況隻适用于不用顯示進度的場合，如果要顯示進度的場合就沒用處了，好吧，接下來看下網上一個簡單的自定義圓形進度條！代碼還是比較簡單，容易了解，又興趣可以看看，或者進行相關擴充~

運作效果圖：

Android 應用開發（44）---ProgressBar(進度條)

實作代碼：

自定義View類：

/**
 * Created by Jay on 2015/8/5 0005.
 */
public class CirclePgBar extends View {


    private Paint mBackPaint;
    private Paint mFrontPaint;
    private Paint mTextPaint;
    private float mStrokeWidth = 50;
    private float mHalfStrokeWidth = mStrokeWidth / 2;
    private float mRadius = 200;
    private RectF mRect;
    private int mProgress = 0;
    //目标值，想改多少就改多少
    private int mTargetProgress = 90;
    private int mMax = 100;
    private int mWidth;
    private int mHeight;


    public CirclePgBar(Context context) {
        super(context);
        init();
    }

    public CirclePgBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CirclePgBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }


    //完成相關參數初始化
    private void init() {
        mBackPaint = new Paint();
        mBackPaint.setColor(Color.WHITE);
        mBackPaint.setAntiAlias(true);
        mBackPaint.setStyle(Paint.Style.STROKE);
        mBackPaint.setStrokeWidth(mStrokeWidth);

        mFrontPaint = new Paint();
        mFrontPaint.setColor(Color.GREEN);
        mFrontPaint.setAntiAlias(true);
        mFrontPaint.setStyle(Paint.Style.STROKE);
        mFrontPaint.setStrokeWidth(mStrokeWidth);


        mTextPaint = new Paint();
        mTextPaint.setColor(Color.GREEN);
        mTextPaint.setAntiAlias(true);
        mTextPaint.setTextSize(80);
        mTextPaint.setTextAlign(Paint.Align.CENTER);
    }


    //重寫測量大小的onMeasure方法和繪制View的核心方法onDraw()
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        mWidth = getRealSize(widthMeasureSpec);
        mHeight = getRealSize(heightMeasureSpec);
        setMeasuredDimension(mWidth, mHeight);

    }


    @Override
    protected void onDraw(Canvas canvas) {
        initRect();
        float angle = mProgress / (float) mMax * 360;
        canvas.drawCircle(mWidth / 2, mHeight / 2, mRadius, mBackPaint);
        canvas.drawArc(mRect, -90, angle, false, mFrontPaint);
        canvas.drawText(mProgress + "%", mWidth / 2 + mHalfStrokeWidth, mHeight / 2 + mHalfStrokeWidth, mTextPaint);
        if (mProgress < mTargetProgress) {
            mProgress += 1;
            invalidate();
        }

    }

    public int getRealSize(int measureSpec) {
        int result = 1;
        int mode = MeasureSpec.getMode(measureSpec);
        int size = MeasureSpec.getSize(measureSpec);

        if (mode == MeasureSpec.AT_MOST || mode == MeasureSpec.UNSPECIFIED) {
            //自己計算
            result = (int) (mRadius * 2 + mStrokeWidth);
        } else {
            result = size;
        }

        return result;
    }

    private void initRect() {
        if (mRect == null) {
            mRect = new RectF();
            int viewSize = (int) (mRadius * 2);
            int left = (mWidth - viewSize) / 2;
            int top = (mHeight - viewSize) / 2;
            int right = left + viewSize;
            int bottom = top + viewSize;
            mRect.set(left, top, right, bottom);
        }
    }


}

然後在布局檔案中加上：

<com.jay.progressbardemo.CirclePgBar
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

就是這麼簡單~

本節小結：

本節給大家介紹了Android中的常用控件：ProgressBar講解了基本用法，以及實際開發中對于進度條的兩種實作方法，第二個自定義進度條可以自行完善，然後用到實際開發中~！好的，本節就到這裡，謝謝~

Android 應用開發（44）---ProgressBar(進度條)

ProgressBar(進度條)

1.常用屬性講解與基礎執行個體

2.使用動畫來替代圓形進度條

3.自定義圓形進度條

本節小結：

繼續閱讀

安卓6.0權限申請詳解

安卓自定義PopWindow

Android 5.0/5.1 HOOK技術探究

Android 手機螢幕分辨率

android 應用基礎知識（2）---應用資源Android資源

安卓關于Notification中setLatestEventInfo方法已棄用

Android Hook 實戰--替換第三方sdk的類場景：問題描述：解決方案：總結

Android架構元件四 Android Architecture Components LiveData元件解析

gps的冷啟動

主線程中的Looper.loop()一直無限循環為什麼不會造成ANR？

Android四大元件之Service使用詳解

Android 6.0 運作時權限

2017Android開發你必須要掌握的熱門開源架構 Android 2017熱門流行架構【簡單說】你能在本篇文章中收獲什麼? 他們是什麼?一句話告訴你

android應用開發的幾個重要概念

fragment生命周期 1 生命周期兩張圖 2 生命周期分析