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

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

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

package com.example.circleprogressbar;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View; public class CircleProgressBarView extends View {
private int progress;
private int max;
private Paint paint;
private RectF oval;
public int getMax() {
return max;
}
public void setMax(int max) {
this.max = max;
}
public int getProgress() {
return progress;
}
public void setProgress(int progress) {
this.progress = progress;
invalidate();
} public CircleProgressBarView(Context context, AttributeSet attrs) {
super(context, attrs);
paint = new Paint();
oval = new RectF();
} @Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
paint.setAntiAlias(true);// 设置是否抗锯齿
paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿
paint.setColor(Color.GRAY);// 设置画笔灰色
paint.setStrokeWidth(10);// 设置画笔宽度
paint.setStyle(Paint.Style.STROKE);// 设置中空的样式
canvas.drawCircle(100, 100, 55, paint);// 在中心为(100,100)的地方画个半径为55的圆,宽度为setStrokeWidth:10,也就是灰色的底边
paint.setColor(Color.GREEN);// 设置画笔为绿色
oval.set(45, 45, 155, 155);// 设置类似于左上角坐标(45,45),右下角坐标(155,155),这样也就保证了半径为55
canvas.drawArc(oval, -90, ((float) progress / max) * 360, false, paint);// 画圆弧,第二个参数为:起始角度,第三个为跨的角度,第四个为true的时候是实心,false的时候为空心
paint.reset();// 将画笔重置
paint.setStrokeWidth(3);// 再次设置画笔的宽度
paint.setTextSize(35);// 设置文字的大小
paint.setColor(Color.BLACK);// 设置画笔颜色
if (progress == max) {
canvas.drawText("完成", 70, 110, paint);
} else {
canvas.drawText(progress + "%", 70, 110, paint);
}
}
}
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".CirclePbActivity" > <com.example.circleprogressbar.CircleProgressBarView
android:id="@+id/circleProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
package com.example.circleprogressbar;

import android.os.Bundle;
import android.os.Handler;
import android.app.Activity;
import android.view.Menu; public class CirclePbActivity extends Activity {
private CircleProgressBarView testConvas;
private int i = 0;
Handler handler = new Handler() {
public void handleMessage(android.os.Message msg) {
testConvas.setProgress(msg.what);
if (i <= testConvas.getMax()) {
handler.sendEmptyMessageDelayed(i++, 50);
}
};
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_circle_progressbar);
testConvas = (CircleProgressBarView) findViewById(R.id.circleProgressBar);
testConvas.setMax(100);
handler.sendEmptyMessageDelayed(i++, 50);
}
}

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

package com.example.circleprogressbar;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View; @SuppressLint("DrawAllocation")
public class HorizontalProgressBarView extends View {
private int progress = 50;
private int max = 100;
private int mwidth = 450;
private int mhight = 40;
private int startX;
private int startY;
private Paint paint; public int getMwidth() {
return mwidth;
} public void setMwidth(int mwidth) {
this.mwidth = mwidth;
} public int getMhight() {
return mhight;
} public void setMhight(int mhight) {
this.mhight = mhight;
} public int getProgress() {
return progress;
} public void setProgress(int progress) {
this.progress = progress;
invalidate();
} public int getMax() {
return max;
} public void setMax(int max) {
this.max = max;
} public HorizontalProgressBarView(Context context, AttributeSet attrs) {
super(context, attrs);
paint = new Paint();
} @Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
paint.setAntiAlias(true);// 设置是否抗锯齿
paint.setFlags(Paint.ANTI_ALIAS_FLAG);// 帮助消除锯齿
paint.setColor(Color.parseColor("#EFEFEF"));// 设置画笔灰色
paint.setStrokeWidth(10);// 设置画笔宽度
canvas.drawRect(startX, startY, mwidth, mhight, paint);
paint.setColor(Color.parseColor("#76B034"));
canvas.drawRect(startX, startY, ((float) progress / max) * mwidth,
mhight, paint);
// 绘制内部线条
paint.setStrokeWidth(2);
paint.setColor(Color.YELLOW);
canvas.drawLine(startX, startY + (mhight - startY) / 4 * 1,
((float) progress / max) * mwidth, startY + (mhight - startY)
/ 4 * 1, paint);
paint.setColor(Color.RED);
canvas.drawLine(startX, startY + (mhight - startY) / 4 * 2,
((float) progress / max) * mwidth, startY + (mhight - startY)
/ 4 * 2, paint);
paint.setColor(Color.WHITE);
canvas.drawLine(startX, startY + (mhight - startY) / 4 * 3,
((float) progress / max) * mwidth, startY + (mhight - startY)
/ 4 * 3, paint);
// 绘制下标进度数字
if(progress<(max/3)){
paint.setColor(Color.BLACK);
}else if(progress<(max/3)*2&&progress>(max/3)){
paint.setColor(Color.YELLOW);
}else{
paint.setColor(Color.RED);
}
paint.setTextSize(30);
canvas.drawText(progress + "%", ((float) progress / max) * mwidth - 20,
mhight + 30, paint);
}
}

最后谈一下感想:

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

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

  1. 自定义控件 环形进度条 ProgressBar

    使用 public class MainActivity extends Activity implements OnComompleteListener {     private int num  ...

  2. [C#] (原创)一步一步教你自定义控件——04,ProgressBar(进度条)

    一.前言 技术没有先进与落后,只有合适与不合适. 本篇的自定义控件是:进度条(ProgressBar). 进度条的实现方式多种多样,主流的方式有:使用多张图片去实现.使用1个或2个Panel放到Use ...

  3. android自定义控件(三)ProgressBar

     1.ProgressBar有两个进度,一个是android:progress,另一个是android:secondaryProgress.比如视频的缓存进度以及播放进度. 在这里缓存的进度就可以是a ...

  4. Android中的自定义控件(二)

    案例四: 自定义开关       功能介绍:本案例实现的功能是创建一个自定义的开关,可以自行决定开关的背景.当滑动开关时,开关的滑块可跟随手指移动.当手指松开后,滑块根据开关的状态,滑到最右边或者滑到 ...

  5. Android笔记——Android自定义控件

    目录: 1.自定义控件概述 01_什么是自定义控件 Android系统中,继承Android系统自带的View或者ViewGroup控件或者系统自带的控件,并在这基础上增加或者重新组合成我们想要的效果 ...

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

    这篇博客为大家介绍一个android常见的功能——ListView下拉刷新(参考自他人博客,网址忘记了,阅读他的代码自己理解注释的,希望能帮助到大家): 首先下拉未松手时候手机显示这样的界面: 下面的 ...

  7. Android自定义控件(二)

    这一篇主要来讲一下自定义控件中的自定义viewgroup,我们以项目中最常用的下拉刷新和加载更多组件为例 简单介绍一下自定义viewgroup时应该怎么做. 分析:下拉刷新和加载更多的原理和步骤 自定 ...

  8. ProgressBar显示进度值,垂直或者水平滚动条

    过去一段时间,在研究Windows的系统控件ProgressBar,一直奇怪为啥它不能显示进度值,本以为是个很简单的问题,结果搜索很久,也没有找到好的解决方案,最后终于找到一个Perfect方案,特记 ...

  9. WPF自定义控件与样式(10)-进度控件ProcessBar自定义样

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Pro ...

随机推荐

  1. android关于installLocation

    以下内容主要参考自官网的描述. 从Android API-8开始,android允许你将应用程序安装到外部存储空间中去(比方:SD卡),你可以在AndroidManifest.xml中添加androi ...

  2. getting “fatal: not a git repository: '.'” when using post-update hook to execute 'git pull' on another repo

    Here is the script that ultimately worked. I think the bit I was originally missing that prevented i ...

  3. Ajax跨域访问问题-方法大全

    Case I. Web代理的方式 (on Server A) 即用户访问A网站时所产生的对B网站的跨域访问请求均提交到A网站的指定页面,由该页面代替用户页面完成交互,从而返回合适的结果.此方案可以解决 ...

  4. Android开源项目(转载)

    第一部分 界面 ImageView.ProgressBar及其他如Dialog.Toast.EditText.TableView.Activity Animation等等. 一.ListView an ...

  5. windows 基础及基本软件测试环境搭建

  6. Hive 的 排序

    全排序:order by对全部所有的数据进行排序,在实现的时候是放到一个reduce中进行的,可以想象这样做效率是比较低的: 局部排序:sort by对数据进行分组,然后在组内进行排序,每个reduc ...

  7. Cinder-1 TinderBox

    Cinder:http://libcinder.org/,当前版本是0.8.5,代码托管位置:https://github.com/cinder/Cinder.git 下载Cinder之后,其目录结构 ...

  8. 【转】转移Package Cache文件夹,转移Windows Installer文件夹

    详见http://blogs.msdn.com/b/heaths/archive/2014/02/11/how-to-relocate-the-package-cache.aspx (注意:若Wind ...

  9. wndows 7 Wifi热点

    2016年09月13日 14時52分 wanglinqiang整理 Step1 cmd.exe(管理员身份运行) Step2 命令行输入[netsh wlan set hostednetwork mo ...

  10. word的不同章节之间添加不同的页眉

    1.点击空百处 2. 在页面布局中,找到分隔符,选择”连续“选项,即在空白处插入分隔符 特别注意:这里分隔符会出现换行现象,请选择空白处,不要影响原先布局 3. 当编辑下一个页眉时,点击“链接到前一条 ...