安卓自定义View实现图片上传进度显示(仿QQ)
首先看下我们想要实现的效果如下图(qq聊天中发送图片时的效果):
再看下图我们实现的效果:
实现原理很简单,首先我们上传图片时需要一个进度值progress,这个不管是自己写的上传的方法还是使用第三方开源库,其次,需要自定义一个View并重写onDraw方法,此例中的进度是开启了一个线程,然后模仿进度递增,然后将进度值通过自定义View调用一个自定义方法传进自定义View并根据进度进行重绘。
绘制分为三部分:
1.绘制矩形(图片面积)上半部分阴影区;
2.绘制矩形(图片面积)下半部分非阴影区;
3.绘制中间进度值(文字);
onDraw代码:
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); mPaint.setAntiAlias(true); // 消除锯齿 mPaint.setStyle(Paint.Style.FILL); mPaint.setColor(Color.parseColor("#70000000"));//半透明 canvas.drawRect(0, 0, getWidth(), getHeight()-getHeight()*progress/100, mPaint); mPaint.setColor(Color.parseColor("#00000000"));//全透明 canvas.drawRect(0, getHeight()-getHeight()*progress/100, getWidth(), getHeight(), mPaint); mPaint.setTextSize(30); mPaint.setColor(Color.parseColor("#FFFFFF")); mPaint.setStrokeWidth(2); Rect rect=new Rect(); mPaint.getTextBounds("100%", 0, "100%".length(), rect);//确定文字的宽度 canvas.drawText(progress+"%", getWidth()/2-rect.width()/2,getHeight()/2, mPaint); }
传入进度值的方法:
public void setProgress(int progress){ this.progress=progress; postInvalidate(); };
主界面调用方法:
customView=(CustomView6) findViewById(R.id.customView); //模拟图片上传进度 new Thread(new Runnable() { @Override public void run() { while (true){ if(progress==100){//图片上传完成 handler.sendEmptyMessage(SUCCESS); return; } progress++; customView.setProgress(progress); try{ Thread.sleep(200); //暂停0.2秒 } catch (InterruptedException e){ e.printStackTrace(); } } } }).start();
demo下载地址:http://download.csdn.net/detail/baiyuliang2013/8690773
安卓自定义View实现图片上传进度显示(仿QQ)的更多相关文章
- ruby on rails爬坑(三):图片上传及显示
一,问题及思路 最近在用rails + react + mysql基本框架写一个cms + client的项目,里面涉及到了图片的上传及显示,下面简单说说思路,至于这个项目的配置部署,应该会在寒假结束 ...
- 图片上传即时显示javascript代码
这是基于javascript的一种图片上传即时显示方法,测试结果IE6和火狐浏览器可以正常使用.google浏览器不兼容. 这种方法兼容性比较差,仅供参考,建议使用ajax方法来即时显示图片. 1.首 ...
- 图片上传并显示(兼容ie),图片大小判断
图片上传并显示(兼容ie),图片大小判断 HTML <div id="swf" style="margin: 0 auto;text-align: center;& ...
- silverlight漂亮的文件上传进度显示原理及示例
silverlight漂亮的文件上传进度显示原理及示例 作者:chenxumi 出处:博客园 2009/11/27 13:37:11 阅读 1219 次 概述:在网站根目录web.config里配 ...
- vue 上传进度显示
参考资料: https://ask.csdn.net/questions/767017 https://www.cnblogs.com/best-fyx/p/11363506.html 我使用的是el ...
- 使用element UI el-upload组件实现视频文件上传及上传进度显示方法总结
实现效果: 上传中: 上传完成: 代码: <el-form-item label="视频上传" prop="Video"> <!-- acti ...
- 图片上传和显示——上传图片——上传文件)==ZJ
http://www.cnblogs.com/yc-755909659/archive/2013/04/17/3026409.html aspx上传 http://www.cnblogs.com/mq ...
- ueditor图片上传和显示问题
图片上传: 这段是contorller代码 @RequestMapping(value = "/uploadImg", method = RequestMethod.POST) @ ...
- struts中用kindeditor实现的图片上传并且显示在页面上
做公司网站的时候由于需要在内容属性中加入图片,所以就有了这个问题,本来一开始找几篇文章看都是讲修改kindeditor/jsp/file_manager_json.jsp和upload_json.js ...
随机推荐
- ●洛谷P2606 [ZJOI2010]排列计数
题链: https://www.luogu.org/problemnew/show/P2606题解: 组合数(DP),Lucas定理 首先应该容易看出,这个排列其实是一个小顶堆. 然后我们可以考虑dp ...
- ●BZOJ 2839 集合计数
题链: http://www.lydsy.com/JudgeOnline/problem.php?id=2839 题解: 容斥原理 真的是神题!!! 定义 f[k] 表示交集大小至少为 k时的方案数怎 ...
- Luogu1613 跑路
题目描述 小A的工作不仅繁琐,更有苛刻的规定,要求小A每天早上在6:00之前到达公司,否则这个月工资清零.可是小A偏偏又有赖床的坏毛病.于是为了保住自己的工资,小A买了一个十分牛B的空间跑路器,每秒钟 ...
- [bzoj4755][Jsoi2016]扭动的回文串
来自FallDream的博客,未经允许,请勿转载,谢谢. JYY有两个长度均为N的字符串A和B. 一个“扭动字符串S(i,j,k)由A中的第i个字符到第j个字符组成的子串与B中的第j个字符到第k个字符 ...
- Java多线程基础总结
一.线程和进程关系 二.创建方式1.继承Thread类,重写run方法2.实现Runable接口,重写run方法3.使用匿名内部类 三.API接口start()currentThread() 获取当前 ...
- 用HTTP状态码实现提交表单后刷新页面不重复提交
正常情况下,表单提交后如果用户刷新页面会重复提交表单,有些情况下我们不希望表单重复提交,利用HTTP协议中的307状态码重定向页面可以实现这个目的.实例如下: 表单页面代码: <form act ...
- React .js框架的环境搭建
React学习笔记(一)- 环境搭建 最近在学习react相关的知识,刚刚起步,一路遇坑不断.自己做个笔记,方便日后总结,也供相同趣味的小伙伴一起交流探讨. 学习时主要参考官网的教程:https: ...
- 在vue生命周期中及时销毁全局作用的代码
一.纯客户端中 对于全局的代码,比如定时器等,在 beforeDestroy或 destroyed 生命周期时将其销毁.如果在跳转路由时候,组件销毁了,全局的定时器却没有销毁,这会使得页面产生卡顿. ...
- js操作符+和()
ECMA-262 描述了一组用于操作数据值的操作符,包括一元操作符.算数操作符逻辑操作符.关系操作符.赋值操作符.字符串操作符.对象操作符等.ECMAScript 操作符的与众不同之处在于,它们能够适 ...
- Django笔记--模型
ORM是"对象-关系-映射"的简称,在Django当中,ORM就是模型类的管理器对象.操作顺序是先定义模型类,再定义模型类管理器,然后在模型类中实例化一个模型类管理器的对象,作为模 ...