码迷，mamicode.com
首页 > 其他好文 > 详细

自定义控件之-----progressBar

时间：2014-05-10 06:00:07      阅读：328      评论：0      收藏：0      [点我收藏+]

标签：android   style   blog   class   java   tar   

写了那一年多代码都没有认认真真写过自定义控件，最近看到网易新闻里面的加载图标如图bubuko.com,布布扣

感觉很有意思，就准备自己写个玩玩。在api里面脑补了一些canvas的姿势，就上了，效果如下。

bubuko.com,布布扣

说实话真心不难，自定义控件比起平时做的应用多了几分自由和创作的快感，可能我应该去做游戏，代码如下，注释已经写的很白痴了：

 

[java] view plaincopyprint?
 
  1. package com.example.circleprogressbar;  
  2.   
  3. import android.content.Context;  
  4. import android.graphics.Canvas;  
  5. import android.graphics.Color;  
  6. import android.graphics.Paint;  
  7. import android.graphics.RectF;  
  8. import android.util.AttributeSet;  
  9. import android.view.View;  
  10.   
  11. public class CircleProgressBarView extends View {  
  12.     private int progress;  
  13.     private int max;  
  14.     private Paint paint;  
  15.     private RectF oval;  
  16.     public int getMax() {  
  17.         return max;  
  18.     }  
  19.     public void setMax(int max) {  
  20.         this.max = max;  
  21.     }  
  22.     public int getProgress() {  
  23.         return progress;  
  24.     }  
  25.     public void setProgress(int progress) {  
  26.         this.progress = progress;  
  27.         invalidate();  
  28.     }  
  29.   
  30.     public CircleProgressBarView(Context context, AttributeSet attrs) {  
  31.         super(context, attrs);  
  32.         paint = new Paint();  
  33.         oval = new RectF();  
  34.     }  
  35.   
  36.     @Override  
  37.     protected void onDraw(Canvas canvas) {  
  38.         super.onDraw(canvas);  
  39.         paint.setAntiAlias(true);// 设置是否抗锯齿  
  40.         paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿  
  41.         paint.setColor(Color.GRAY);// 设置画笔灰色  
  42.         paint.setStrokeWidth(10);// 设置画笔宽度  
  43.         paint.setStyle(Paint.Style.STROKE);// 设置中空的样式  
  44.         canvas.drawCircle(100, 100, 55, paint);// 在中心为（100,100）的地方画个半径为55的圆，宽度为setStrokeWidth：10，也就是灰色的底边  
  45.         paint.setColor(Color.GREEN);// 设置画笔为绿色  
  46.         oval.set(45, 45, 155, 155);// 设置类似于左上角坐标（45,45），右下角坐标（155,155），这样也就保证了半径为55  
  47.         canvas.drawArc(oval, -90, ((float) progress / max) * 360, false, paint);// 画圆弧，第二个参数为：起始角度，第三个为跨的角度，第四个为true的时候是实心，false的时候为空心  
  48.         paint.reset();// 将画笔重置  
  49.         paint.setStrokeWidth(3);// 再次设置画笔的宽度  
  50.         paint.setTextSize(35);// 设置文字的大小  
  51.         paint.setColor(Color.BLACK);// 设置画笔颜色  
  52.         if (progress == max) {  
  53.             canvas.drawText("完成", 70, 110, paint);  
  54.         } else {  
  55.             canvas.drawText(progress + "%", 70, 110, paint);  
  56.         }  
  57.     }  
  58. }  

 

[html] view plaincopyprint?
 
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:paddingBottom="@dimen/activity_vertical_margin"  
  6.     android:paddingLeft="@dimen/activity_horizontal_margin"  
  7.     android:paddingRight="@dimen/activity_horizontal_margin"  
  8.     android:paddingTop="@dimen/activity_vertical_margin"  
  9.     tools:context=".CirclePbActivity" >  
  10.   
  11.     <com.example.circleprogressbar.CircleProgressBarView  
  12.         android:id="@+id/circleProgressBar"  
  13.         android:layout_width="wrap_content"  
  14.         android:layout_height="wrap_content" />  
  15. </RelativeLayout>  

 

[java] view plaincopyprint?
 
  1. package com.example.circleprogressbar;  
  2.   
  3. import android.os.Bundle;  
  4. import android.os.Handler;  
  5. import android.app.Activity;  
  6. import android.view.Menu;  
  7.   
  8. public class CirclePbActivity extends Activity {  
  9.     private CircleProgressBarView testConvas;  
  10.     private int i = 0;  
  11.     Handler handler = new Handler() {  
  12.         public void handleMessage(android.os.Message msg) {  
  13.             testConvas.setProgress(msg.what);  
  14.             if (i <= testConvas.getMax()) {  
  15.                 handler.sendEmptyMessageDelayed(i++, 50);  
  16.             }  
  17.         };  
  18.     };  
  19.     @Override  
  20.     protected void onCreate(Bundle savedInstanceState) {  
  21.         super.onCreate(savedInstanceState);  
  22.         setContentView(R.layout.activity_circle_progressbar);  
  23.         testConvas = (CircleProgressBarView) findViewById(R.id.circleProgressBar);  
  24.         testConvas.setMax(100);  
  25.         handler.sendEmptyMessageDelayed(i++, 50);  
  26.     }  
  27. }  


做了圆形的，一不做二不休，把horizontalProgressBar也做了一遍，加了一点创意要素，立马多了几分艺术气息(其实好像更俗气了)，各位可以自己发挥想象力。

 

bubuko.com,布布扣

 

[java] view plaincopyprint?
 
  1. package com.example.circleprogressbar;  
  2.   
  3. import android.annotation.SuppressLint;  
  4. import android.content.Context;  
  5. import android.graphics.Bitmap;  
  6. import android.graphics.BitmapFactory;  
  7. import android.graphics.Canvas;  
  8. import android.graphics.Color;  
  9. import android.graphics.Paint;  
  10. import android.util.AttributeSet;  
  11. import android.view.View;  
  12.   
  13. @SuppressLint("DrawAllocation")  
  14. public class HorizontalProgressBarView extends View {  
  15.     private int progress = 50;  
  16.     private int max = 100;  
  17.     private int mwidth = 450;  
  18.     private int mhight = 40;  
  19.     private int startX;  
  20.     private int startY;  
  21.     private Paint paint;  
  22.   
  23.     public int getMwidth() {  
  24.         return mwidth;  
  25.     }  
  26.   
  27.     public void setMwidth(int mwidth) {  
  28.         this.mwidth = mwidth;  
  29.     }  
  30.   
  31.     public int getMhight() {  
  32.         return mhight;  
  33.     }  
  34.   
  35.     public void setMhight(int mhight) {  
  36.         this.mhight = mhight;  
  37.     }  
  38.   
  39.     public int getProgress() {  
  40.         return progress;  
  41.     }  
  42.   
  43.     public void setProgress(int progress) {  
  44.         this.progress = progress;  
  45.         invalidate();  
  46.     }  
  47.   
  48.     public int getMax() {  
  49.         return max;  
  50.     }  
  51.   
  52.     public void setMax(int max) {  
  53.         this.max = max;  
  54.     }  
  55.   
  56.     public HorizontalProgressBarView(Context context, AttributeSet attrs) {  
  57.         super(context, attrs);  
  58.         paint = new Paint();  
  59.     }  
  60.   
  61.     @Override  
  62.     protected void onDraw(Canvas canvas) {  
  63.         super.onDraw(canvas);  
  64.         paint.setAntiAlias(true);// 设置是否抗锯齿  
  65.         paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿  
  66.         paint.setColor(Color.parseColor("#EFEFEF"));// 设置画笔灰色  
  67.         paint.setStrokeWidth(10);// 设置画笔宽度  
  68.         canvas.drawRect(startX, startY, mwidth, mhight, paint);  
  69.         paint.setColor(Color.parseColor("#76B034"));  
  70.         canvas.drawRect(startX, startY, ((float) progress / max) * mwidth,  
  71.                 mhight, paint);  
  72.         // 绘制内部线条  
  73.         paint.setStrokeWidth(2);  
  74.         paint.setColor(Color.YELLOW);  
  75.         canvas.drawLine(startX, startY + (mhight - startY) / 4 * 1,  
  76.                 ((float) progress / max) * mwidth, startY + (mhight - startY)  
  77.                         / 4 * 1, paint);  
  78.         paint.setColor(Color.RED);  
  79.         canvas.drawLine(startX, startY + (mhight - startY) / 4 * 2,  
  80.                 ((float) progress / max) * mwidth, startY + (mhight - startY)  
  81.                         / 4 * 2, paint);  
  82.         paint.setColor(Color.WHITE);  
  83.         canvas.drawLine(startX, startY + (mhight - startY) / 4 * 3,  
  84.                 ((float) progress / max) * mwidth, startY + (mhight - startY)  
  85.                         / 4 * 3, paint);  
  86.         // 绘制下标进度数字  
  87.         if(progress<(max/3)){  
  88.             paint.setColor(Color.BLACK);  
  89.         }else if(progress<(max/3)*2&&progress>(max/3)){  
  90.             paint.setColor(Color.YELLOW);  
  91.         }else{  
  92.             paint.setColor(Color.RED);  
  93.         }  
  94.         paint.setTextSize(30);  
  95.         canvas.drawText(progress + "%", ((float) progress / max) * mwidth - 20,  
  96.                 mhight + 30, paint);  
  97.     }  
  98. }  

最后谈一下感想：

 

总感觉学的越多，自己的想象力和创新能力越枯竭，代码敲多了，脑袋敲不灵活了，以前没接触程序的时候有很多的想法，现在感觉自己越来越平庸，没了那份想象力，和搬砖的有什么区别？天朝的教育让能很快学会人家的技术，但是永远跟着别人后面，就看各大布局，各种控件，基本上都是学国外的。哎，不吐槽了，已经这样了，我希望能保存自己仅有的那份想象力，在敲代码的时候多想想自己能创造什么，一次从无到有，比重复千万次人家的都有价值，我是这么认为的。

 

原文：http://blog.csdn.net/mobilexu/article/details/9666461

自定义控件之-----progressBar,布布扣,bubuko.com

自定义控件之-----progressBar

标签：android   style   blog   class   java   tar   

原文地址：http://www.cnblogs.com/veins/p/3719424.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！