Android ProgressBar自定义

效果图如下

开发中经常会有自定义进度条需求，下面举例水平和垂直两个方向的进度条如何进行自定义

布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:background="@android:color/darker_gray"
tools:context="com.example.progressbardemo.MainActivity">

    <ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:max="100"
        android:progress="20"
        android:progressDrawable="@drawable/costom_progress_shape"
        android:secondaryProgress="70" />


    <ProgressBar
        android:id="@+id/progressBar1"
        style="@style/App.Widget.ProgressBar"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginTop="100dp"
        android:layout_gravity="center"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:indeterminate="false"
        android:interpolator="@android:anim/linear_interpolator" />
</LinearLayout>

水平方向的自定义
定义一个costom_progress_shape放到drawable目录下

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 背景色 -->
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dip" />
            <solid android:color="@android:color/white" />
        </shape>
    </item>


    <!-- 第二条进度条设置 -->
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="10dip" />

                <solid android:color="@android:color/holo_blue_dark" />
            </shape>
        </clip>
    </item>


    <!-- 默认进度条设置 -->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <solid android:color="@android:color/background_dark" />
            </shape>
        </clip>
    </item>

</layer-list>

最后直接在布局文件引用即可。并且默认引用的样式为水平方向的

<ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:max="100"
        android:progress="20"
        android:progressDrawable="@drawable/costom_progress_shape"
        android:secondaryProgress="70" />

垂直loding的自定义

1.同样新增一个progressbar_rotate_shape文件
表示将图片进行360度的旋转

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/common_ic_loading_icon"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360"></rotate>

2.style.xml文件添加样式

<style name="App.Widget.ProgressBar" parent="@android:style/Widget.ProgressBar">
        <item name="android:indeterminateDrawable">@drawable/progressbar_rotate_shape</item>
        <item name="android:indeterminateDuration">1000</item>
</style>

注:扩展样式

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

3.同样在布局文件引用即可

<ProgressBar
        android:id="@+id/progressBar1"
        style="@style/App.Widget.ProgressBar"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginTop="100dp"
        android:layout_gravity="center"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:indeterminate="false"
        android:interpolator="@android:anim/linear_interpolator" />