Android控件：ProgressBar使用詳解

1、環形進度條

ProgressBar 默認style 爲 style="?android:attr/progressBarStyle" ，爲一個環形進度條。

<ProgressBar
    style="?android:attr/progressBarStyle"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_margin="8dp"
    android:indeterminate="true"
    android:indeterminateDrawable="@drawable/bg_gradient_rotate" />

<ProgressBar
    style="?android:attr/progressBarStyle"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_margin="8dp"
    android:indeterminateDrawable="@drawable/bg_gradient_animated_rotate"/>
    

查找源碼：
themes.xml

<item name="progressBarStyle">@style/Widget.ProgressBar</item>

styles.xml

<style name="Widget.ProgressBar">
    <item name="indeterminateOnly">true</item>
    <item name="indeterminateDrawable">@drawable/progress_medium_white</item>
    <item name="indeterminateBehavior">repeat</item>
    <item name="indeterminateDuration">3500</item>
    <item name="minWidth">48dip</item>
    <item name="maxWidth">48dip</item>
    <item name="minHeight">48dip</item>
    <item name="maxHeight">48dip</item>
    <item name="mirrorForRtl">false</item>
</style>

通過styles.xml源碼可以看出 indeterminateOnly 爲 true, 環形進度條都是非精確的, indeterminate, progress, progressDrawable 屬性的設置均爲無效的。只能通過android:indeterminateDrawable 指代非精確進度條對應的Drawable 。 這個Drawable 的 最頂層標籤可以爲 或 ，animated-rotate 的幀數幀率在源碼看是可調的，但我們自己寫無法調整，所以看起來會很卡。

bg_ring_with_gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="3"
    android:shape="ring"
    android:thicknessRatio="9"
    android:useLevel="false">
    <gradient
        android:endColor="#1FBDFF"
        android:startColor="#FFFFFF"
        android:type="sweep" />
</shape>

bg_gradient_rotate.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/bg_ring_with_gradient"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="1080.0">
</rotate>

bg_gradient_animated_rotate.xml

<?xml version="1.0" encoding="utf-8"?>
<animated-rotate
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/bg_ring_with_gradient"
    android:pivotX="50%"
    android:pivotY="50%"
    android:framesCount="12"
    android:frameDuration="100">
</animated-rotate>
<!--framesCount 和 frameDuration 在我們的代碼中不可以設置，對應的屬性應該被隱藏了-->

運行截圖：

2、橫向進度條

橫向進度條對應的style爲style="?android:attr/progressBarStyleHorizontal"，此style 默認的 android:indeterminate 爲 false 即進度是確定的。

<ProgressBar
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:indeterminate="true"/>
    
<ProgressBar
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:indeterminate="false"
    android:progress="40"
    android:progressDrawable="@drawable/progress_horizontal" />

查找源碼：
themes.xml

<item name="progressBarStyleHorizontal">@style/Widget.ProgressBar.Horizontal</item>

styles.xml

<style name="Widget.ProgressBar.Horizontal">
    <item name="indeterminateOnly">false</item>
    <item name="progressDrawable">@drawable/progress_horizontal</item>
    <item name="indeterminateDrawable">@drawable/progress_indeterminate_horizontal</item>
    <item name="minHeight">20dip</item>
    <item name="maxHeight">20dip</item>
    <item name="mirrorForRtl">true</item>
</style>

通過styles.xml源碼可以看出 indeterminateOnly 爲 false, 所以 indeterminate, progress, progressDrawable 屬性都是可以自由設置的，當不設置時使用styles.xml中設定的默認資源
當android:indeterminate 爲false時 ，此時 andorid:progress 及 android:progressDrawable 的屬性設置生效
當android:indeterminate 爲true時，此時 android:indeterminateDrawable 屬性生效

android:progressDrawable 對應的Drawable 資源一般使用layer-list , 三個item： background, secondaryProgress, progress 分別對應 背景，第二進度和進度，可以不全部設置

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dip" />
            <gradient
                    android:startColor="#ff9d9e9d"
                    android:centerColor="#ff5a5d5a"
                    android:centerY="0.75"
                    android:endColor="#ff747674"
                    android:angle="270"
            />
        </shape>
    </item>
    
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#80ffd300"
                        android:centerColor="#80ffb600"
                        android:centerY="0.75"
                        android:endColor="#a0ffcb00"
                        android:angle="270"
                />
            </shape>
        </clip>
    </item>
    
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#ffffd300"
                        android:centerColor="#ffffb600"
                        android:centerY="0.75"
                        android:endColor="#ffffcb00"
                        android:angle="270"
                />
            </shape>
        </clip>
    </item>
    
</layer-list>

運行截圖：