android ProgressBar 自定义进度条颜色

android 自定义进度条颜色

先看图

基于产品经理各种自定义需求,经过查阅了解,下面是自己对android自定义进度条的学习过程!


这个没法了只能看源码了,还好下载了源码, sources\base\core\res\res\  下应有尽有,修改进度条颜色只能找progress ,因为是改变样式,首先找styles.xml

找到xml后,进去找到

[html]  view plain copy print ?
  1. <span style="font-size: 18px;">    <style name="Widget.ProgressBar">  
  2.         <item name="android:indeterminateOnly">true</item>  
  3.         <item name="android:indeterminateDrawable">@android:drawable/progress_medium_white</item>  
  4.         <item name="android:indeterminateBehavior">repeat</item>  
  5.         <item name="android:indeterminateDuration">3500</item>  
  6.         <item name="android:minWidth">48dip</item>  
  7.         <item name="android:maxWidth">48dip</item>  
  8.         <item name="android:minHeight">48dip</item>  
  9.         <item name="android:maxHeight">48dip</item>  
  10.     </style></span>  
[html]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:18px;">    <style name="Widget.ProgressBar">  
  2.         <item name="android:indeterminateOnly">true</item>  
  3.         <item name="android:indeterminateDrawable">@android:drawable/progress_medium_white</item>  
  4.         <item name="android:indeterminateBehavior">repeat</item>  
  5.         <item name="android:indeterminateDuration">3500</item>  
  6.         <item name="android:minWidth">48dip</item>  
  7.         <item name="android:maxWidth">48dip</item>  
  8.         <item name="android:minHeight">48dip</item>  
  9.         <item name="android:maxHeight">48dip</item>  
  10.     </style></span>  


这是默认转圈的效果style,但今天我们修改的是水平进度条颜色!

所以找到

[html]  view plain copy print ?
  1. <span style="font-size: 18px;"> <style name="Widget.ProgressBar.Horizontal">  
  2.         <item name="android:indeterminateOnly">false</item>  
  3.         <item name="android:progressDrawable">@android:drawable/progress_horizontal</item>  
  4.         <item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>  
  5.         <item name="android:minHeight">20dip</item>  
  6.         <item name="android:maxHeight">20dip</item>  
  7.     </style></span>  
[html]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:18px;"> <style name="Widget.ProgressBar.Horizontal">  
  2.         <item name="android:indeterminateOnly">false</item>  
  3.         <item name="android:progressDrawable">@android:drawable/progress_horizontal</item>  
  4.         <item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>  
  5.         <item name="android:minHeight">20dip</item>  
  6.         <item name="android:maxHeight">20dip</item>  
  7.     </style></span>  

 你看系统一步一步关联的,扩展性很性,低耦合,所以我们现在只要改变进度条是怎么样画出来的就行了 ,但是负责画进度条的是

<item name="android:progressDrawable">  所以我们可以找到"drawable下的 progress_horizontal 文件,改变他就可以改变进度条颜色

[java]  view plain copy print ?
  1. <span style="font-size: 18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <!-- Copyright (C) 2008 The Android Open Source Project  
  3.   
  4.      Licensed under the Apache License, Version 2.0 (the "License");  
  5.      you may not use this file except in compliance with the License.  
  6.      You may obtain a copy of the License at  
  7.   
  8.           http://www.apache.org/licenses/LICENSE-2.0  
  9.   
  10.      Unless required by applicable law or agreed to in writing, software  
  11.      distributed under the License is distributed on an "AS IS" BASIS,  
  12.      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  
  13.      See the License for the specific language governing permissions and  
  14.      limitations under the License.  
  15. -->  
  16.   
  17. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  18.       
  19.     <item android:id="@android:id/background">  
  20.         <shape>  
  21.             <corners android:radius="5dip" />  
  22.             <gradient  
  23.                     android:startColor="#ff9d9e9d"  
  24.                     android:centerColor="#ff5a5d5a"  
  25.                     android:centerY="0.75"  
  26.                     android:endColor="#ff747674"  
  27.                     android:angle="270"  
  28.             />  
  29.         </shape>  
  30.     </item>  
  31.       
  32.     <item android:id="@android:id/secondaryProgress">  
  33.         <clip>  
  34.             <shape>  
  35.                 <corners android:radius="5dip" />  
  36.                 <gradient  
  37.                         android:startColor="#80ffd300"  
  38.                         android:centerColor="#80ffb600"  
  39.                         android:centerY="0.75"  
  40.                         android:endColor="#a0ffcb00"  
  41.                         android:angle="270"  
  42.                 />  
  43.             </shape>  
  44.         </clip>  
  45.     </item>  
  46.       
  47.     <item android:id="@android:id/progress">  
  48.         <clip>  
  49.             <shape>  
  50.                 <corners android:radius="5dip" />  
  51.                 <gradient  
  52.                         android:startColor="#ffffd300"  
  53.                         android:centerColor="#ffffb600"  
  54.                         android:centerY="0.75"  
  55.                         android:endColor="#ffffcb00"  
  56.                         android:angle="270"  
  57.                 />  
  58.             </shape>  
  59.         </clip>  
  60.     </item>  
  61.       
  62. </layer-list>  
  63.   
  64. </span>  
[java]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <!-- Copyright (C) 2008 The Android Open Source Project  
  3.   
  4.      Licensed under the Apache License, Version 2.0 (the "License");  
  5.      you may not use this file except in compliance with the License.  
  6.      You may obtain a copy of the License at  
  7.   
  8.           http://www.apache.org/licenses/LICENSE-2.0  
  9.   
  10.      Unless required by applicable law or agreed to in writing, software  
  11.      distributed under the License is distributed on an "AS IS" BASIS,  
  12.      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  
  13.      See the License for the specific language governing permissions and  
  14.      limitations under the License.  
  15. -->  
  16.   
  17. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  18.       
  19.     <item android:id="@android:id/background">  
  20.         <shape>  
  21.             <corners android:radius="5dip" />  
  22.             <gradient  
  23.                     android:startColor="#ff9d9e9d"  
  24.                     android:centerColor="#ff5a5d5a"  
  25.                     android:centerY="0.75"  
  26.                     android:endColor="#ff747674"  
  27.                     android:angle="270"  
  28.             />  
  29.         </shape>  
  30.     </item>  
  31.       
  32.     <item android:id="@android:id/secondaryProgress">  
  33.         <clip>  
  34.             <shape>  
  35.                 <corners android:radius="5dip" />  
  36.                 <gradient  
  37.                         android:startColor="#80ffd300"  
  38.                         android:centerColor="#80ffb600"  
  39.                         android:centerY="0.75"  
  40.                         android:endColor="#a0ffcb00"  
  41.                         android:angle="270"  
  42.                 />  
  43.             </shape>  
  44.         </clip>  
  45.     </item>  
  46.       
  47.     <item android:id="@android:id/progress">  
  48.         <clip>  
  49.             <shape>  
  50.                 <corners android:radius="5dip" />  
  51.                 <gradient  
  52.                         android:startColor="#ffffd300"  
  53.                         android:centerColor="#ffffb600"  
  54.                         android:centerY="0.75"  
  55.                         android:endColor="#ffffcb00"  
  56.                         android:angle="270"  
  57.                 />  
  58.             </shape>  
  59.         </clip>  
  60.     </item>  
  61.       
  62. </layer-list>  
  63.   
  64. </span>  

看到没有,这是系统的进度条画出的布局条件

android:startColor="#80ffd300"

android:centerColor="#80ffb600"

android:endColor="#ff747674"

我们只要改变这个色值就能改变他的颜色,主要改变的是<item android:id="@android:id/progress">下的色值就行了

 

说了这么多,到底怎么做呢, 很简单

 1  。 在我们的项目下新建一个 style.xml 文件

      创建一个style 标签,集成系统默认样式,然后自定义一个新的progressDrawable  文件,随后面在layout 中的progress 中引用这个文件就行

 

<style name="ProgressBar_Mini" parent="@android:style/Widget.ProgressBar.Horizontal">
        <item name="android:maxHeight">50dip</item>
        <item name="android:minHeight">8dip</item>
        <item name="android:indeterminateOnly">false</item>
        <item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>
        <item name="android:progressDrawable">@drawable/progressbar_mini</item>
    </style>

 下面是我的  progressbar_mini  文件,改变了下android:endColor="#F5F5F5" android:startColor="#BEBEBE"  的色值

[java]  view plain copy print ?
  1. <span style="font-size: 18px;"><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  
  2.   
  3.     <item android:id="@android:id/background">  
  4.          <shape >  
  5.                 <corners android:radius="5dip" />  
  6.                 <gradient  
  7.                     android:angle="270"  
  8.                     android:centerY="0.75"  
  9.                     android:endColor="#F5F5F5"  
  10.                     android:startColor="#BEBEBE" />  
  11.             </shape>  
  12.     </item>  
  13.   
  14.     <item android:id="@android:id/secondaryProgress">  
  15.   
  16.         <clip >  
  17.             <shape >  
  18.                 <corners android:radius="0dip" />  
  19.                 <gradient  
  20.                     android:angle="270"  
  21.                     android:centerY="0.75"  
  22.                    android:endColor="#165CBC"  
  23.                     android:startColor="#85B0E9" />  
  24.             </shape>  
  25.         </clip>  
  26.     </item>  
  27.   
  28.     <item android:id="@android:id/progress">  
  29.   
  30.         <clip >  
  31.             <shape >  
  32.                 <corners android:radius="5dip" />  
  33.                 <gradient  
  34.                     android:angle="270"  
  35.                     android:centerY="0.75"  
  36.                    android:endColor="#165CBC"  
  37.                     android:startColor="#85B0E9" />  
  38.             </shape>  
  39.             
  40.         </clip>  
  41.     </item>  
  42. </layer-list></span>  
[java]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:18px;"><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  
  2.   
  3.     <item android:id="@android:id/background">  
  4.          <shape >  
  5.                 <corners android:radius="5dip" />  
  6.                 <gradient  
  7.                     android:angle="270"  
  8.                     android:centerY="0.75"  
  9.                     android:endColor="#F5F5F5"  
  10.                     android:startColor="#BEBEBE" />  
  11.             </shape>  
  12.     </item>  
  13.   
  14.     <item android:id="@android:id/secondaryProgress">  
  15.   
  16.         <clip >  
  17.             <shape >  
  18.                 <corners android:radius="0dip" />  
  19.                 <gradient  
  20.                     android:angle="270"  
  21.                     android:centerY="0.75"  
  22.                    android:endColor="#165CBC"  
  23.                     android:startColor="#85B0E9" />  
  24.             </shape>  
  25.         </clip>  
  26.     </item>  
  27.   
  28.     <item android:id="@android:id/progress">  
  29.   
  30.         <clip >  
  31.             <shape >  
  32.                 <corners android:radius="5dip" />  
  33.                 <gradient  
  34.                     android:angle="270"  
  35.                     android:centerY="0.75"  
  36.                    android:endColor="#165CBC"  
  37.                     android:startColor="#85B0E9" />  
  38.             </shape>  
  39.             
  40.         </clip>  
  41.     </item>  
  42. </layer-list></span>  


最后在中引用就可以了

  <ProgressBar
        android:id="@+id/progress"
        style="@style/ProgressBar_Mini"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:progress="50" />

 

转载申明初入:http://blog.csdn.net/liao3841054/article/details/7556551

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
自定义半圆形进度条,我们可以通过继承ProgressBar类,并重写其中的一些方法来实现。 首先,我们需要创建一个自定义ProgressBar类,并在构造方法中定义一些必要的属性,如进度条颜色、进度值等。然后,我们可以通过重写onMeasure方法来测量进度条的大小,保证其为一个半圆形。接着,我们需要重写onDraw方法来绘制进度条的样式。在这个方法中,我们可以利用Canvas和Paint来绘制一个半圆形的背景,并使用同样的方式绘制进度条的进度部分。 在绘制进度条的进度部分时,我们需要根据当前的进度值来确定进度的角度,并使用Path类的arcTo方法来绘制一个与进度值对应的扇形。同时,我们还可以调用Paint的setShader方法来设置进度条的渐变效果,使得进度从一种颜色平滑过渡到另一种颜色。 除了绘制进度条的样式外,我们还可以根据需要为进度条添加一些动画效果。例如,我们可以使用ValueAnimator类来实现进度的平滑过渡,通过不断改变进度值并调用invalidate方法来触发重绘,从而实现进度条的动态效果。 最后,我们还可以根据需要为自定义的半圆形进度条添加一些其他功能,如进度文字显示、进度监听等。这些功能的实现方式与一般的ProgressBar类似,只需在自定义类中添加相应的方法即可。 通过以上的步骤,我们可以实现一个自定义的半圆形进度条,满足我们对进度条样式和功能的需求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值