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

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

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

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

[java] view plaincopyprint?

  1. package com.example.circleprogressbar;

  2. import android.content.Context;

  3. import android.graphics.Canvas;

  4. import android.graphics.Color;

  5. import android.graphics.Paint;

  6. import android.graphics.RectF;

  7. import android.util.AttributeSet;

  8. import android.view.View;

  9. public class CircleProgressBarView extends View {

  10. private int progress;

  11. private int max;

  12. private Paint paint;

  13. private RectF oval;

  14. public int getMax() {

  15. return max;

  16. }

  17. public void setMax(int max) {

  18. this.max = max;

  19. }

  20. public int getProgress() {

  21. return progress;

  22. }

  23. public void setProgress(int progress) {

  24. this.progress = progress;

  25. invalidate();

  26. }

  27. public CircleProgressBarView(Context context, AttributeSet attrs) {

  28. super(context, attrs);

  29. paint = new Paint();

  30. oval = new RectF();

  31. }

  32. @Override

  33. protected void onDraw(Canvas canvas) {

  34. super.onDraw(canvas);

  35. paint.setAntiAlias(true);// 设置是否抗锯齿

  36. paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿

  37. paint.setColor(Color.GRAY);// 设置画笔灰色

  38. paint.setStrokeWidth(10);// 设置画笔宽度

  39. paint.setStyle(Paint.Style.STROKE);// 设置中空的样式

  40. canvas.drawCircle(100, 100, 55, paint);// 在中心为（100,100）的地方画个半径为55的圆，宽度为setStrokeWidth：10，也就是灰色的底边

  41. paint.setColor(Color.GREEN);// 设置画笔为绿色

  42. oval.set(45, 45, 155, 155);// 设置类似于左上角坐标（45,45），右下角坐标（155,155），这样也就保证了半径为55

  43. canvas.drawArc(oval, -90, ((float) progress / max) * 360, false, paint);// 画圆弧，第二个参数为：起始角度，第三个为跨的角度，第四个为true的时候是实心，false的时候为空心

  44. paint.reset();// 将画笔重置

  45. paint.setStrokeWidth(3);// 再次设置画笔的宽度

  46. paint.setTextSize(35);// 设置文字的大小

  47. paint.setColor(Color.BLACK);// 设置画笔颜色

  48. if (progress == max) {

  49. canvas.drawText("完成", 70, 110, paint);

  50. } else {

  51. canvas.drawText(progress + "%", 70, 110, paint);

  52. }

  53. }

  54. }

[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. <com.example.circleprogressbar.CircleProgressBarView

  11. android:id="@+id/circleProgressBar"

  12. android:layout_width="wrap_content"

  13. android:layout_height="wrap_content" />

  14. </RelativeLayout>

[java] view plaincopyprint?

  1. package com.example.circleprogressbar;

  2. import android.os.Bundle;

  3. import android.os.Handler;

  4. import android.app.Activity;

  5. import android.view.Menu;

  6. public class CirclePbActivity extends Activity {

  7. private CircleProgressBarView testConvas;

  8. private int i = 0;

  9. Handler handler = new Handler() {

  10. public void handleMessage(android.os.Message msg) {

  11. testConvas.setProgress(msg.what);

  12. if (i <= testConvas.getMax()) {

  13. handler.sendEmptyMessageDelayed(i++, 50);

  14. }

  15. };

  16. };

  17. @Override

  18. protected void onCreate(Bundle savedInstanceState) {

  19. super.onCreate(savedInstanceState);

  20. setContentView(R.layout.activity_circle_progressbar);

  21. testConvas = (CircleProgressBarView) findViewById(R.id.circleProgressBar);

  22. testConvas.setMax(100);

  23. handler.sendEmptyMessageDelayed(i++, 50);

  24. }

  25. }

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

[java] view plaincopyprint?

  1. package com.example.circleprogressbar;

  2. import android.annotation.SuppressLint;

  3. import android.content.Context;

  4. import android.graphics.Bitmap;

  5. import android.graphics.BitmapFactory;

  6. import android.graphics.Canvas;

  7. import android.graphics.Color;

  8. import android.graphics.Paint;

  9. import android.util.AttributeSet;

  10. import android.view.View;

  11. @SuppressLint("DrawAllocation")

  12. public class HorizontalProgressBarView extends View {

  13. private int progress = 50;

  14. private int max = 100;

  15. private int mwidth = 450;

  16. private int mhight = 40;

  17. private int startX;

  18. private int startY;

  19. private Paint paint;

  20. public int getMwidth() {

  21. return mwidth;

  22. }

  23. public void setMwidth(int mwidth) {

  24. this.mwidth = mwidth;

  25. }

  26. public int getMhight() {

  27. return mhight;

  28. }

  29. public void setMhight(int mhight) {

  30. this.mhight = mhight;

  31. }

  32. public int getProgress() {

  33. return progress;

  34. }

  35. public void setProgress(int progress) {

  36. this.progress = progress;

  37. invalidate();

  38. }

  39. public int getMax() {

  40. return max;

  41. }

  42. public void setMax(int max) {

  43. this.max = max;

  44. }

  45. public HorizontalProgressBarView(Context context, AttributeSet attrs) {

  46. super(context, attrs);

  47. paint = new Paint();

  48. }

  49. @Override

  50. protected void onDraw(Canvas canvas) {

  51. super.onDraw(canvas);

  52. paint.setAntiAlias(true);// 设置是否抗锯齿

  53. paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿

  54. paint.setColor(Color.parseColor("#EFEFEF"));// 设置画笔灰色

  55. paint.setStrokeWidth(10);// 设置画笔宽度

  56. canvas.drawRect(startX, startY, mwidth, mhight, paint);

  57. paint.setColor(Color.parseColor("#76B034"));

  58. canvas.drawRect(startX, startY, ((float) progress / max) * mwidth,

  59. mhight, paint);

  60. // 绘制内部线条

  61. paint.setStrokeWidth(2);

  62. paint.setColor(Color.YELLOW);

  63. canvas.drawLine(startX, startY + (mhight - startY) / 4 * 1,

  64. ((float) progress / max) * mwidth, startY + (mhight - startY)

  65. / 4 * 1, paint);

  66. paint.setColor(Color.RED);

  67. canvas.drawLine(startX, startY + (mhight - startY) / 4 * 2,

  68. ((float) progress / max) * mwidth, startY + (mhight - startY)

  69. / 4 * 2, paint);

  70. paint.setColor(Color.WHITE);

  71. canvas.drawLine(startX, startY + (mhight - startY) / 4 * 3,

  72. ((float) progress / max) * mwidth, startY + (mhight - startY)

  73. / 4 * 3, paint);

  74. // 绘制下标进度数字

  75. if(progress<(max/3)){

  76. paint.setColor(Color.BLACK);

  77. }else if(progress<(max/3)*2&&progress>(max/3)){

  78. paint.setColor(Color.YELLOW);

  79. }else{

  80. paint.setColor(Color.RED);

  81. }

  82. paint.setTextSize(30);

  83. canvas.drawText(progress + "%", ((float) progress / max) * mwidth - 20,

  84. mhight + 30, paint);

  85. }

  86. }

最后谈一下感想：

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

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

时间： 2024-10-07 20:54:35

自定义控件之-----progressBar的相关文章

Android自定义控件---继承ProgressBar功能扩展

一.前言 前一段时间在做视频开发,由于本人刚接触视频开发这块,所以 领导没有对我提很高的要求,仅仅要求能够播放本地视频即可. 我想怎么简单怎么做.于是选择用Android VideoView控件来播放视频 (后面发现VideoView的灵活性实在太差,我不想吐槽). 最终的效果图: 视频全屏效果 这次的任务主要难度在于进度条这个控件.各位可以从上面的两张图中看到,进度条被分 为三段.每段表示一个视频,并且每个视频的长度不一,也就意味着每段视频进度条的前进速度是不相同的. 难点总结: 1.自定义控

【android自定义控件】ProgressBar自定义

ProgressBar分为垂直和水平 经常在数据加载过程中,为了让用户感觉友好,弹出一个提示圆形的加载框 水平的经常在下载应用的时候用到,还伴随着下载进度. ProgressBar的样式有四种: android:progressBarStyle:默认进度条样式,不确定模式 android:progressBarStyleHorizontal:水平进度条样式 android:progressBarStyleLarge :大号进度条样式,也是不确定进度模式 android:progressBarSt

android自定义控件（三）ProgressBar

1.ProgressBar有两个进度,一个是android:progress,另一个是android:secondaryProgress.比如视频的缓存进度以及播放进度. 在这里缓存的进度就可以是android:secondaryProgress,而播放进度就是android:progress. 2.ProgressBar分为确定的和不确定的 二.style 1.Widget.ProgressBar.Horizontal <style name="Widget.ProgressBar.Ho

自定义控件和使用的两种基本方法

有时需要一些组合起来的功能性强的控件,为了以后复用简单,还是自己自定义比较方便. 这里以一个自定义的导航栏为例子,在MainActivity里面使用这个控件. 方法一: 设计并编写自定义控件的布局文件,然后在其他布局文件中include. title的布局文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android

Android仿天猫下拉刷新自定义控件

1.概述 控件基于android-Ultra-Pull-to-Refresh做的header定制,继承PtrFrameLayout,把事件分发给里面的RadioGroup,所以两个自定义控件分别叫HoynPtrFrameLayout,HoynRadioGroup. 因为需要PtrFrameLayout里面的一些私有属性:mPtrIndicator,mScrollChecker,所以把PtrFrameLayout代码提取出来,方便定制,使得HoynPtrFrameLayout可以更好的使用. 2.

自定义控件基础02_下拉刷新_侧拉菜单_自定义属性

自定义控件02 自定义控件 ①,纯粹自定义绘制 ②,在原生的基础上追加功能. 1,下拉刷新功能(继承ListView追加功能)(下拉刷新,加载更多,两个功能) 1.1 下拉刷新 ①创建一个类,继承ListView 创建自定义适配器,设置数据 额外:自定义控件会放到view包下 ②自定义控件的头(即下拉的时候显示的view) 推荐名称initHeaderView();在构造方法中初始化这个头 this.addHeaderView()//添加一个头布局的控件,在listView顶部添加一个头 头部u

Android—自定义控件实现ListView下拉刷新

这篇博客为大家介绍一个android常见的功能——ListView下拉刷新(参考自他人博客,网址忘记了,阅读他的代码自己理解注释的,希望能帮助到大家): 首先下拉未松手时候手机显示这样的界面: 下面的代码是自定的扎样的控件: package com.dhsr.smartID.view; import android.content.Context; import android.util.AttributeSet; import android.view.Gravity; import andr

Android ProgressBar详解以及自定义

版本:1.0 日期:2014.5.16 版权:© 2014 kince 转载注明出处 这一次主要说一下Android下的进度条,为什么是它呢,因为近期被其各种美轮美奂的设计所倾倒,计划逐渐去实现.另外一个因素也是它也是为数不多的直接继承于View类的控件,从中可以学习到一些自定义控件的知识.下面列举了一些个人觉得还算漂亮的进度条,仅供参考. 是不是很漂亮,其实就像上面图形展示的那样,进度条大体上无非就是这几种形式.这样一来肯定是需要自定义了,所以方向有两个:要么继承于系统的ProgressBar

Android中的自定义控件（二）

案例四: 自定义开关       功能介绍:本案例实现的功能是创建一个自定义的开关,可以自行决定开关的背景.当滑动开关时,开关的滑块可跟随手指移动.当手指松开后,滑块根据开关的状态,滑到最右边或者滑到最左边,同时保存开关的状态,将开关的状态回调给调用者.当然,上述功能系统给定的switch控件也可以实现.      实现步骤:        1. 写一个类继承view,重写两个参数的构造方法.在构造方法中指定工作空间,通过attrs.getAttributeResourceValue方法将jav