安卓自定义进度条

先看下系统的源码

   
   

    
    

     
      <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>
    
    
   
   

其中 android:progressDrawable 是滚动的效果，那我们来看下系统drawable/ progressDrawable.xml是怎么实现的

    
    

     
     

      
      <?xml version="1.0" encoding="utf-8"?>
     
     
     
     

      
      <!-- Copyright (C) 2008 The Android Open Source Project
     
     
     
     

      
      
     
     
     
     

      
           Licensed under the Apache License, Version 2.0 (the "License");
     
     
     
     

      
           you may not use this file except in compliance with the License.
     
     
     
     

      
           You may obtain a copy of the License at
     
     
     
     

      
      
     
     
     
     

      
                http://www.apache.org/licenses/LICENSE-2.0
     
     
     
     

      
      
     
     
     
     

      
           Unless required by applicable law or agreed to in writing, software
     
     
     
     

      
           distributed under the License is distributed on an "AS IS" BASIS,
     
     
     
     

      
           WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     
     
     
     

      
           See the License for the specific language governing permissions and
     
     
     
     

      
           limitations under the License.
     
     
     
     

      
      -->
     
     
     
     

      
      
     
     
     
     

      
      <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>
     
     
    
    

我们直接复制progress_horizontal.xml文件到我们的drawable目录下

只要重写默认图片的属性就行了

    
    

     
     

      
      <?xml version="1.0" encoding="utf-8"?>
     
     
     
     

      
      <!-- Copyright (C) 2008 The Android Open Source Project
     
     
     
     

      
      
     
     
     
     

      
           Licensed under the Apache License, Version 2.0 (the "License");
     
     
     
     

      
           you may not use this file except in compliance with the License.
     
     
     
     

      
           You may obtain a copy of the License at
     
     
     
     

      
      
     
     
     
     

      
                http://www.apache.org/licenses/LICENSE-2.0
     
     
     
     

      
      
     
     
     
     

      
           Unless required by applicable law or agreed to in writing, software
     
     
     
     

      
           distributed under the License is distributed on an "AS IS" BASIS,
     
     
     
     

      
           WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     
     
     
     

      
           See the License for the specific language governing permissions and
     
     
     
     

      
           limitations under the License.
     
     
     
     

      
      -->
     
     
     
     

      
      
     
     
     
     

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

      
          
     
     
     
     

      
          <item android:id="@android:id/background" android:drawable="@drawable/security_progress_bg">
     
     
     
     

      
          </item>
     
     
     
     

      
          
     
     
     
     

      
          <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/security_progress">
     
     
     
     

      
             
     
     
     
     

      
          </item>
     
     
     
     

      
          
     
     
     
     

      
          <item android:id="@android:id/progress" android:drawable="@drawable/security_progress">
     
     
     
     

      
             
     
     
     
     

      
          </item>
     
     
     
     

      
          
     
     
     
     

      
      </layer-list>
     
     
    
    

只是把图片改了。

我们在到style.xml文件里新建一个样式

    
    

     
     

      
          <style name="my_pb" parent="android:style/Widget.ProgressBar.Horizontal">
     
     
     
     

      
               <item name="android:progressDrawable">@drawable/progress_horizontal</item>
     
     
     
     

      
          </style>
     
     
    
    

继承 android:style/Widget.ProgressBar.Horizontal

只需要重写 android:progressDrawable的默认进度样式就行了

然后再我们的样式里面调用

    
    

     
     

      
      <ProgressBar
     
     
     
     

      
                      android:layout_marginTop="3dip"
     
     
     
     

      
                      android:layout_marginLeft="5dip"
     
     
     
     

      
                      android:layout_marginRight="5dip"
     
     
     
     

      
                      android:id="@+id/progressBar1"
     
     
     
     

      
                      style="@style/my_pb"
     
     
     
     

      
                      android:layout_width="match_parent"
     
     
     
     

      
                      android:layout_height="wrap_content" />
     
     
    
    

看效果

 

搞定了。。