自定義進(jìn)度條基礎(chǔ)篇之樣式表
-
樣式（style）
<ProgressBar style="@style/Widget.AppCompat.ProgressBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="100"/>
1.1 系統(tǒng)是默認(rèn)樣式有
style="@style/Widget.AppCompat.ProgressBar"圓形進(jìn)度條
style="@style/Widget.AppCompat.ProgressBar.Horizontal"水平進(jìn)度條
系統(tǒng)自帶樣式的進(jìn)度條.jpg
- 一般圓形的適用于沒有具體進(jìn)度奸例，需要用戶等待的場(chǎng)景何荚。
- 而條形的適用于有具體進(jìn)度的情況，比如加載中，下載進(jìn)度的提示活鹰。
1.2 自定義樣式
一般我們不會(huì)使用系統(tǒng)自帶的樣式分冈，比如進(jìn)度的顏色，進(jìn)度條的高度偎血，等等簡(jiǎn)單的修改诸衔。這時(shí)候我們只需要改動(dòng)一下樣式，就可以達(dá)到目的颇玷。
在res/values/styles里邊新建
<style name="update_progress_horizontal" parent="Widget.AppCompat.ProgressBar.Horizontal">
<item name="android:indeterminateOnly">false</item>
<!--進(jìn)度條的進(jìn)度顏色drawable文件-->
<item name="android:progressDrawable">@drawable/progress_indeterminate_horizontal</item>
<!--進(jìn)度條的最小高度-->
<item name="android:minHeight">17dp</item>
<!--進(jìn)度條的最大高度-->
<item name="android:maxHeight">17dp</item>
</style>
然后再ProgressBar中引用我們自定義的樣式就可以了笨农。
<ProgressBar
style="@style/update_progress_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"/>
update_progress_horizontal其中的android:progressDrawable我們可以自己定義進(jìn)度條的顏色禽绪。在res/drawable下新建progress_indeterminate_horizontal文件（layer-list類型的）
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!--未加載的進(jìn)度區(qū)域-->
<item android:id="@android:id/background">
<shape>
<!--進(jìn)度條的圓角-->
<corners android:radius="15dip" />
<!--未加載的進(jìn)度區(qū)域顏色-->
<solid android:color="#FFDBDBDB"/>
</shape>
</item>
<!--緩沖的進(jìn)度的顏色环壤，一般視頻播放的緩沖區(qū)域-->
<item android:id="@android:id/secondaryProgress">
<clip>
<shape>
<!--進(jìn)度條的圓角-->
<corners android:radius="15dip" />
<!--緩沖的進(jìn)度的顏色，一般視頻播放的緩沖進(jìn)度-->
<solid android:color="#80C07AB8"/>
</shape>
</clip>
</item>
<!--已經(jīng)加載完的進(jìn)度的區(qū)域-->
<item android:id="@android:id/progress">
<clip>
<shape>
<!--進(jìn)度條的圓角-->
<corners android:radius="15dip" />
<!--已經(jīng)加載完的進(jìn)度的顏色-->
<solid android:color="#FF706EB3"/>
</shape>
</clip>
</item>
</layer-list>
自定義樣式的進(jìn)度條.png
當(dāng)然如果 已經(jīng)加載完的進(jìn)度的區(qū)域
image.png
換成 下面的樣式,就可以是加載完成的部分右邊也有圓角
<!--已經(jīng)加載完的進(jìn)度的區(qū)域-->
<item android:id="@android:id/progress">
<scale android:scaleWidth="100%">
<shape>
<!--進(jìn)度條的圓角-->
<corners android:radius="9dp" />
<!--已經(jīng)加載完的進(jìn)度的顏色-->
<solid android:color="#008CFF"/>
</shape>
</scale>
</item>
效果圖如下
image.png
