android自定义进度条渐变色View，不使用任何图片资源

http://blog.csdn.net/springsky_/article/details/17954765

最近在公司，项目不是很忙了，偶尔看见一个兄台在CSDN求助，帮忙要一个自定义的渐变色进度条，我当时看了一下进度条，感觉挺漂亮的，就尝试的去自定义view实现了一个，废话不说，先上图吧！
   

这个自定义的view，完全脱离了android自带的ProgressView，并且没使用一张图片，这样就能更好的降低程序代码上的耦合性！

下面我贴出代码  ，大概讲解一下实现思路吧！
   

[java] view plain copy

1. package com.spring.progressview;  
2.   
3. import android.content.Context;  
4. import android.graphics.Canvas;  
5. import android.graphics.Color;  
6. import android.graphics.LinearGradient;  
7. import android.graphics.Matrix;  
8. import android.graphics.Paint;  
9. import android.graphics.RectF;  
10. import android.graphics.Shader;  
11. import android.util.AttributeSet;  
12. import android.view.View;  
13.   
14. /*** 
15.  * 自定义进度条 
16.  * @author spring sky 
17.  * Email:vipa1888@163.com 
18.  * 创建时间：2014-1-6下午3:28:51 
19.  */  
20. public class SpringProgressView extends View {  
21.       
22.     /**分段颜色*/  
23.     private static final int[] SECTION_COLORS = {Color.GREEN,Color.YELLOW,Color.RED};  
24.     /**进度条最大值*/  
25.     private float maxCount;  
26.     /**进度条当前值*/  
27.     private float currentCount;  
28.     /**画笔*/  
29.     private Paint mPaint;  
30.     private int mWidth,mHeight;  
31.       
32.     public SpringProgressView(Context context, AttributeSet attrs,  
33.             int defStyleAttr) {  
34.         super(context, attrs, defStyleAttr);  
35.         initView(context);  
36.     }  
37.   
38.     public SpringProgressView(Context context, AttributeSet attrs) {  
39.         super(context, attrs);  
40.         initView(context);  
41.     }  
42.   
43.     public SpringProgressView(Context context) {  
44.         super(context);  
45.         initView(context);  
46.     }  
47.       
48.     private void initView(Context context) {  
49.     }  
50.   
51.     @Override  
52.     protected void onDraw(Canvas canvas) {  
53.         super.onDraw(canvas);  
54.         mPaint = new Paint();  
55.         mPaint.setAntiAlias(true);  
56.         int round = mHeight/2;  
57.         System.out.println("max="+maxCount + "  current="+currentCount);  
58.         mPaint.setColor(Color.rgb(71, 76, 80));  
59.         RectF rectBg = new RectF(0, 0, mWidth, mHeight);  
60.         canvas.drawRoundRect(rectBg, round, round, mPaint);  
61.         mPaint.setColor(Color.BLACK);  
62.         RectF rectBlackBg = new RectF(2, 2, mWidth-2, mHeight-2);  
63.         canvas.drawRoundRect(rectBlackBg, round, round, mPaint);  
64.           
65.         float section = currentCount/maxCount;  
66.         RectF rectProgressBg = new RectF(3, 3, (mWidth-3)*section, mHeight-3);  
67.         if(section <= 1.0f/3.0f){  
68.             if(section != 0.0f){  
69.                 mPaint.setColor(SECTION_COLORS[0]);  
70.             }else{  
71.                 mPaint.setColor(Color.TRANSPARENT);  
72.             }  
73.         }else{  
74.             int count = (section <= 1.0f/3.0f*2 ) ? 2 : 3;  
75.             int[] colors = new int[count];  
76.             System.arraycopy(SECTION_COLORS, 0, colors, 0, count);  
77.             float[] positions = new float[count];  
78.             if(count == 2){  
79.                 positions[0] = 0.0f;  
80.                 positions[1] = 1.0f-positions[0];  
81.             }else{  
82.                 positions[0] = 0.0f;  
83.                 positions[1] = (maxCount/3)/currentCount;  
84.                 positions[2] = 1.0f-positions[0]*2;  
85.             }  
86.             positions[positions.length-1] = 1.0f;  
87.             LinearGradient shader = new LinearGradient(3, 3, (mWidth-3)*section, mHeight-3, colors,null, Shader.TileMode.MIRROR);  
88.             mPaint.setShader(shader);  
89.         }  
90.         canvas.drawRoundRect(rectProgressBg, round, round, mPaint);  
91.     }  
92.       
93.     private int dipToPx(int dip) {  
94.         float scale = getContext().getResources().getDisplayMetrics().density;  
95.         return (int) (dip * scale + 0.5f * (dip >= 0 ? 1 : -1));  
96.     }  
97.       
98.     /*** 
99.      * 设置最大的进度值 
100.      * @param maxCount 
101.      */  
102.     public void setMaxCount(float maxCount) {  
103.         this.maxCount = maxCount;  
104.     }  
105.       
106.     /*** 
107.      * 设置当前的进度值 
108.      * @param currentCount 
109.      */  
110.     public void setCurrentCount(float currentCount) {  
111.         this.currentCount = currentCount > maxCount ? maxCount : currentCount;  
112.         invalidate();  
113.     }  
114.       
115.     public float getMaxCount() {  
116.         return maxCount;  
117.     }  
118.       
119.     public float getCurrentCount() {  
120.         return currentCount;  
121.     }  
122.       
123.     @Override  
124.     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {  
125.         int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);  
126.         int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);  
127.         int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);  
128.         int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);  
129.         if (widthSpecMode == MeasureSpec.EXACTLY || widthSpecMode == MeasureSpec.AT_MOST) {  
130.             mWidth = widthSpecSize;  
131.         } else {  
132.             mWidth = 0;  
133.         }  
134.         if (heightSpecMode == MeasureSpec.AT_MOST || heightSpecMode == MeasureSpec.UNSPECIFIED) {  
135.             mHeight = dipToPx(15);  
136.         } else {  
137.             mHeight = heightSpecSize;  
138.         }  
139.         setMeasuredDimension(mWidth, mHeight);  
140.     }  
141.       
142.   
143.       
144. }  

以上代码就是该控件的全部核心代码了
具体思路：
1.进度条，其实就是一个最大值和最小值的比例值，这个比例就是 当前值/最大值;
2.自定义的圆角问题，只要还是用到了Canvar的画板的drawRoundRect ;
3.渐变色：LinearGradient对象渲染，具体渲染的比例要自己计算，目前我的程序提供3中颜色渲染，具体规则是：
(1)当进度条占最大值的三分之一以下，则提供一种颜色
   (2)当最大值超过三分之一话，就区分是否超过三分之二，如果超过则用三种，否则用两种颜色，因为三种颜色各占总进度条的三分之一，这是一个初中数据的问题，自己慢慢画图吧！
4.怎么把进度条放在一个有圆角背景的上面，这个就是绘制两个圆角长方形：第一个作为背景，第二个作为进度条的实体，具体第二个进度的实体占多长，就是当前 currentCount/maxCount*自定义View的长度   ;

其他的，没啥技术难点了，做这种自定义控件，最重要的是，自定要根据人家的效果图，看懂实现思路，具体代码简历在思路上的，否则只会纸上谈兵！如果看不懂，就要多画图，具体的一步步计算，天长地久，也就能“练”出来了！

下面提供一个demo下载地址： SpringProgressDemo