Android自定义ProgressBar的样式

ProgressBar简介

ProgressBar是Android开发中比较常用的一个UI控件，主要是用来显示任务执行的进度的，以及向用户表明任务正在执行中。
Android系统提供的ProgressBar的的样式主要分为两种：水平的进度条，环形进度条。
水平的进度条可以显示任务执行的进度(百分比),而环形进度条不能显示任务执行的进度，环形进度条只是用来向用户表明任务正在执行中。

自定义ProgressBar的样式

1.自定义水平进度条的样式

自定义水平进度条的样式是在系统提供的样式的基础上，通过自定义Drawable资源文件作为progressDrawable的属性值的方式，来实现水平进度条的自定义样式的。
如下：
在res/drawable目录下新建一个drawable资源文件，progress.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="@color/progress_bg" />    <item android:id="@android:id/secondaryProgress">        <scale            android:drawable="@color/secondary_progress"            android:scaleWidth="100%" />    </item>    <item android:id="@android:id/progress">        <scale            android:drawable="@color/progress"            android:scaleWidth="100%" />    </item></layer-list>

在布局文件中使用:

<ProgressBar       android:id="@+id/progressBar"       style="@android:style/Widget.ProgressBar.Horizontal"       android:layout_width="match_parent"       android:layout_height="10dp"       android:progressDrawable="@drawable/progress" />

第一个item定义的是进度条的背景，第二个item定义的是secondaryProgress的颜色,第三个item定义的是进度progress的颜色

注意：

定义progressDrawable的时候，必须要按照这个顺序(如果没有secondaryProgress可以去掉)来定义，并且secondaryProgress和progress定义drawable时都必须用< scale/>子项，否则进度条会一直显示满的状态。
在第代码中设置了进度:

progressBar=(ProgressBar) findViewById(R.id.progressBar);progressBar.setProgress(40);progressBar.setSecondaryProgress(60);

显示效果如下：

2.自定义环形进度条的样式
2.1通过自定义Drawable资源文件作为indeterminateDrawable的属性值，来实现自定义环形进度条的样式。
在res/drawable目录下新建一个Drawable资源文件 progress1.xml

<?xml version="1.0" encoding="utf-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android"    android:fromDegrees="0"    android:pivotX="50%"    android:pivotY="50%"    android:toDegrees="360">    <shape        android:innerRadiusRatio="3"        android:shape="ring"        android:thicknessRatio="20"        android:useLevel="false">        <gradient            android:centerColor="#FFDC35"            android:centerY="0.50"            android:endColor="#CE0000"            android:startColor="#FFFFFF"            android:type="sweep"            android:useLevel="false" />    </shape></rotate>

在布局文件中使用:

 <ProgressBar        style="@android:style/Widget.ProgressBar.Large"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:indeterminateDrawable="@drawable/progress1" />

显示效果如下：

也可以使用一张图片来自定义环形进度条的样式:
在res/drawable目录下新建一个Drawable资源文件 progress2.xml

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

在布局文件中使用:

<ProgressBar        style="@android:style/Widget.ProgressBar.Large"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:indeterminateDrawable="@drawable/progress2" />

显示效果如下：

缺陷：

但是有一个缺点就是，这两种定义环形进度条的方式，都不能控制进度条旋转的速度。

3.使用动画实现环形进度条的效果
环形进度条无非就是一个加载动画，完全可以用一个动画来实现加载动画效果。
在res目录中新建一个anim目录，在anim目录中定义一个补间动画load_anim.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/linear_interpolator">    <rotate        android:duration="1500"        android:fromDegrees="0"        android:pivotX="50%"        android:pivotY="50%"        android:repeatCount="-1"        android:toDegrees="359"></rotate></set>

这里定义这个旋转动画要注意三点，

一个是android:interpolator=”@android:anim/linear_interpolator”
一个是android:toDegrees=”359” 不是360
一个是android:repeatCount=”-1”
这三点共同实现了无限旋转，没有停顿。

在布局文件定义一个ImageView,用来显示动画。

<ImageView        android:id="@+id/progressBar"        android:layout_width="100dp"        android:layout_height="100dp"        android:layout_centerInParent="true"        android:src="@drawable/progress_icon"></ImageView>

在程序中启动动画：

progressBar = (ImageView) findViewById(R.id.progressBar);Animation animation = AnimationUtils.loadAnimation(this, R.anim.load_anim);progressBar.startAnimation(animation);

这样也同样实现了一个加载动画的效果。
显示效果如下：