Android踩坑日记：自定义水平和圆形ProgressBar样式
16lz
2021-01-23
自定义水平和圆形ProgressBar样式
1.自定义水平ProgressBar样式
- ProgressBar分为两种，我们能明确看到进度，不确定的就是不清楚、不确定一个操作需要多长时间来完成，这个时候就需要用的不确定的ProgressBar了。
- ProgressBar（Horizontal 才有，无进度的没有）有两个进度，一个是android:progress，另一个是android:secondaryProgress。后者主要是为缓存需要所涉及的，比如在看网络视频时候都会有一个缓存的进度条以及还要一个播放的进度，在这里缓存的进度就可以是android:secondaryProgress，而播放进度就是android:progress，有了secondProgress，可以很方便定制ProgressBar。
1.ProgressBar的样式设定其实有两种方式，在API文档中说明的方式如下：
- Widget.ProgressBar.Horizontal
- Widget.ProgressBar.Small
- Widget.ProgressBar.Large
- Widget.ProgressBar.Inverse
- Widget.ProgressBar.Small.Inverse
- Widget.ProgressBar.Large.Inverse
使用的时候可以这样：style=”@android:style/Widget.ProgressBar.Horizontal”
另外还有一种方式就是使用系统的attr，下面的方式是系统的style：
- style=”?android:attr/progressBarStyle”
- style=”?android:attr/progressBarStyleHorizontal”
- style=”?android:attr/progressBarStyleInverse”
- style=”?android:attr/progressBarStyleLarge”
- style=”?android:attr/progressBarStyleLargeInverse”
- style=”?android:attr/progressBarStyleSmall”
- style=”?android:attr/progressBarStyleSmallInverse”
- style=”?android:attr/progressBarStyleSmallTitle”
比如：
<ProgressBar android:id="@+id/progressBar" style="@android:style/Widget.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" />ProgressBar android:id="@+id/progressBar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="match_parent" android:layout_height="wrap_content" />我们去看看style=”@android:style/Widget.ProgressBar.Horizontal” 的源码
下面看@android:drawable/progress_horizontal的源码
<?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>三个条目，对应了background，progress，secondaryProgress。所以只需要修改对应项就可以了，如下在drawable文件中创建一个 progressbar_horizontal_custom.xml
所以其实我们要修改样式的话只需要修改android:progressDrawable”对应的资源就可以
<item name="android:progressDrawable">@drawable/progressbar_horizontalitem>video_view_bottom_progressbar_background.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:height="2dp" android:gravity="center"> <shape> <size android:height="2dp"/> <corners android:radius="1dp" /> <solid android:color="#dcdcdc"/> shape> item> <item android:id="@android:id/secondaryProgress" android:height="2dp" android:gravity="center"> <clip > <shape> <size android:height="2dp"/> <corners android:radius="5dp" /> <solid android:color="@android:color/darker_gray"/> shape> clip> item> <item android:id="@android:id/progress" android:height="2dp" android:gravity="center"> <clip > <shape> <size android:height="2dp"/> <corners android:radius="5dp" /> <solid android:color="#FF455B"/> shape> clip> item>layer-list>在布局文件xml中使用：
"@+id/pb_video_bottom_progress" style="@android:style/Widget.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:max="100" android:maxHeight="2dp" android:minHeight="2dp" android:progressDrawable="@drawable/video_view_bottom_progressbar_background" android:visibility="visible" /> 总结：
1. 使用style=”@android:style/Widget.ProgressBar.Horizontal”
2. 重新自自定android:progressDrawable
2.自定义圆形ProgressBar样式
比如
<ProgressBar android:id="@+id/progressBar" style="@android:style/Widget.ProgressBar.Small" android:layout_gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" />我们先看Widget.Progress的源码：
@drawable/progress_small_white的源码：
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/spinner_white_48" android:pivotX="50%" android:pivotY="50%" android:framesCount="12" android:frameDuration="100" />发现其实就是一个不断重复的旋转动画是spinner_white_48的图片，所以我们只需要自定义name=”indeterminateDrawable”的属性，自定义自己的drawable使用animated-rotate 标签即可
总结：
1.修改indeterminateDrawable属性，编写animated-rotate 标签的drawable，替换系统的