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_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 在我们的代码中不可以设置,对应的属性应该被隐藏了-->
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>
运行截图:
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>
运行截图: