Android 自定义图片进度条

用系统的Progressbar,设置图片drawable作为进度条会出现图片长度不好控制,容易被截断,或者变形的问题。而我有个需求,使用图片背景,和图片进度,而且在进度条头部有个闪光点效果。

如下图:

1605e545fb19408284eb6b6bda03fd28.jpeg

找了两个小时,国内外,百度,github搜遍了,全网都没有找到一个现成的。

最后只好自己写一个。本来我用自己代码写的用颜色值的进度条,很容易就实现了。

产品要用设计师的图片。谁知道啊,这么个小功能却这么麻烦,为这么个进度条的功能加班到晚上11点。

package com.alisajidapps.watermarkpdfss.view;import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.View;import com.alisajidapps.watermarkpdfss.R;public class CustomProgressBar extends View {private Paint paint;private Bitmap progressBarImage;private Bitmap backgroundImage;private Bitmap progressPointerBitmap;private Rect srcRect;private Rect dstRect;private int progress;//手机宽度private int screenWidth;private int progressWidth;private int progressHeight;//缩放后的进度条宽度private int progressBarWidthNew;private Rect pointerRect;private Rect pointerDstRect;public CustomProgressBar(Context context) {super(context);init();}public CustomProgressBar(Context context, AttributeSet attrs) {super(context, attrs);init();}public CustomProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}private void init() {paint = new Paint();progressBarImage = BitmapFactory.decodeResource(getResources(), R.drawable.update_progress); // 你的进度条图片资源backgroundImage = BitmapFactory.decodeResource(getResources(), R.drawable.update_progress_bg); // 你的进度条图片资源progressPointerBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.update_progress_seek); // 你的进度条图片资源DisplayMetrics displayMetrics = getResources().getDisplayMetrics();screenWidth = displayMetrics.widthPixels;scale = (float) (screenWidth*0.7/backgroundImage.getWidth());progressWidth =  progressBarImage.getWidth();progressHeight = progressBarImage.getHeight();progressBarWidthNew = (int) (progressBarImage.getWidth()*scale);srcRect = new Rect();dstRect = new Rect();backRect=new Rect();backDstRect=new Rect();pointerRect = new Rect();pointerDstRect = new Rect();progress =10;}public void setProgress(int progress) {this.progress = progress;invalidate(); // 重绘视图}Rect backRect;Rect backDstRect;float scale;@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);Log.e("xxx","scrrenWidth:"+screenWidth);//第一步,画背景backRect.left =0;backRect.top = 0;backRect.right = backgroundImage.getWidth();backRect.bottom = backgroundImage.getHeight();Log.e("xxx",scale+"");Log.e("xxx","backgroundImageWidth:"+backgroundImage.getWidth()+"");backDstRect.top =20;backDstRect.left = (int) (screenWidth/2 - (backgroundImage.getWidth() * scale/2));backDstRect.right = (int) (screenWidth/2 + (backgroundImage.getWidth() * scale/2));backDstRect.bottom = (int) (backgroundImage.getHeight() * scale)+20;// 绘制缩放后的位图,dstRect缩放后,画进去的图片就是缩放的。canvas.drawBitmap(backgroundImage, backRect, backDstRect, paint);//第二步,画进度条srcRect.left = 0;srcRect.top = 0;srcRect.right = progressWidth;srcRect.bottom = progressHeight;Log.e("xxx","progressWidth:"+progressWidth);Log.e("xxx","progressHeight:"+progressHeight);Log.e("xxx","progressbarWidth:"+progressBarImage.getWidth());progressWidth = (int) (progressBarWidthNew *progress / 100 ); // 假设进度是0到100//dstRect  等比例缩放了,画进去的图片就会等比例缩放dstRect.top =30;dstRect.left = (int) (screenWidth/2 -  progressBarWidthNew/2);dstRect.right = dstRect.left+ progressWidth;dstRect.bottom = (int) (progressBarImage.getHeight() * scale+30);canvas.drawBitmap(progressBarImage, srcRect, dstRect, paint);Log.e("xxx","怎么没有绘制:"+progressWidth);//第三步,画进度条前面的指针效果pointerRect.left = 0;pointerRect.top = 0;pointerRect.right = progressPointerBitmap.getWidth();pointerRect.bottom = progressPointerBitmap.getHeight();pointerDstRect.left = dstRect.right-15;pointerDstRect.top = 0;pointerDstRect.right = (int) (dstRect.right+ progressPointerBitmap.getWidth()*scale-15);pointerDstRect.bottom = (int) (progressPointerBitmap.getHeight()*scale);canvas.drawBitmap(progressPointerBitmap,pointerRect,pointerDstRect,paint);}
}

使用时只需要调用setProgressBar就行。

上图就是代码实现的效果。

 

知识总结:

1,基本的绘制图片方法

drawBitmap(Bitmap bitmap, float left, float top, Paint paint)

参数://Bitmap:图片对象,left:偏移左边的位置,top: 偏移顶部的位置

 

2, drawBitmap( Bitmap bitmap, Rect src, Rect dst, Paint paint);

 

这里由2个Rect,第一个Rect --src 代表要裁剪的bitmap的区域,如传null,表示需要绘制整个图片,

 

第二个Rect ---det表示需要将bitmap,绘制在屏幕上的位置,不可为空,并且大于src则把src的裁截区放大,小于src则把src的裁截区缩小。

 

 Bitmap bitmap = BitmapFactory.decodeResource(getContext().getResources(),R.drawable.ic_logo);

        //绘制方法1:---原图,制作偏移

        canvas.drawBitmap(bitmap,100,100,mPaint);//将图片从(0,0)位置向左偏移100,向右偏移100

 

        Rect srcRect = new Rect(0,0,bitmap.getWidth()/2,bitmap.getHeight()/2);//截取图片左上1/4的区域

 

        Rect dstRect = new Rect(500,500,800,800);//图片需要绘制的矩形区域

        //绘制方法2:--先裁剪再展示

        canvas.drawBitmap(bitmap,srcRect,dstRect, mPaint);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/15557.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

速盾:流量攻击防护DDOS有哪几种有效的防御措施?

DDoS(分布式拒绝服务)攻击是一种网络攻击方式,攻击者通过向目标服务器发送大量的请求,超出其处理能力,导致服务器无法正常运行,从而使服务中断或降级。为了保护网络安全,减少DDoS攻击对网站和服…

Kafka(十三)监控与告警

目录 Kafka监控与告警1 解决方案1.2 基础知识JMX监控指标代理查看KafkaJMX远程端口 1.3 真实案例Kafka Exporter:PromethusPromethus Alert ManagerGrafana 1.3 实际操作部署监控和告警系统1.2.1 部署Kafka Exporter1.2.2 部署Prometheus1.2.3 部署AlertManger1.2.4 添加告警规…

大疆上云API本地部署与飞机上云

文章目录 前言一、安装基础环境1. EMQX 安装(版本4.4.0)2. MySql 安装(版本8.0.26)3. Redis 安装 二、部署后端(JDK必须11及以上)三、部署前端四、成为大疆开发者五、飞机注册上云六、绑定飞机七、无人机状态查看八、直播流查看 前言 大疆上云API官方文…

HarmonyOS鸿蒙应用开发——ArkTS的“内置组件 + 样式 + 循环和条件渲染”

一、内置组件是咩? 学过前端的都知道,一个组件就是由多个组件组成的,一个组件也可以是多个小组件组成的,组件就是一些什么导航栏、底部、按钮......啥的,但是组件分为【自定义组件】跟【内置组件】 【自定义组件】就…

Web开发核心

文章目录 1.http协议简介2.http协议特性3.http请求和响应协议4.最简单的Web程序5.基于flask搭建web⽹站6.浏览器开发者⼯具(重点) 1.http协议简介 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于 万维网(WWW:Norld W…

【狂神说Java】Redis笔记以及拓展

一、Redis 入门 Redis为什么单线程还这么快? 误区1:高性能的服务器一定是多线程的? 误区2:多线程(CPU上下文会切换!)一定比单线程效率高! 核心:Redis是将所有的数据放在内…

用于时间序列概率预测的蒙特卡洛模拟

大家好,蒙特卡洛模拟是一种广泛应用于各个领域的计算技术,它通过从概率分布中随机抽取大量样本,并对结果进行统计分析,从而模拟复杂系统的行为。这种技术具有很强的适用性,在金融建模、工程设计、物理模拟、运筹优化以…

【C语言】C语言-设备管理系统(源码+数据文件)【独一无二】

👉博__主👈:米码收割机 👉技__能👈:C/Python语言 👉公众号👈:测试开发自动化【获取源码商业合作】 👉荣__誉👈:阿里云博客专家博主、5…

AI大模型:大数据+大算力+强算法

前言:好久不见,甚是想念,我是辣条,我又回来啦,兄弟们,一别两年,还有多少老哥们在呢? 目录 一年半没更文我干啥去了? AI大模型火了 人工智能 大模型的理解 为什么学习…

ComfyUI完全入门:图生图局部重绘

大家好,我是每天分享AI应用的萤火君! 这篇文章的主题和美女有关,不过并不是教大家生产美女视频,而是讲解 ComfyUI 的图生图局部重绘,其中将会以美女图片为例,来展示局部重绘的强大威力。 先看看效果&…

2024年5月26日 十二生肖 今日运势

小运播报:2024年5月26日,星期日,农历四月十九 (甲辰年己巳月庚寅日),法定节假日。 红榜生肖:马、猪、狗 需要注意:牛、蛇、猴 喜神方位:西北方 财神方位:…

java hashmap在项目中的使用

java hashmap在项目中的使用 1,缓存机制: 在需要频繁访问数据但又不想每次都从数据库或远程服务获取的场景中,可以使用 HashMap 作为缓存。例如,在一个 Web 应用程序中,用户信息可能只需要在登录时从数据库检索一次&a…

解释器和编译器(程序语言基础)

一、解释器 解释器则是一种逐行或逐段地解释执行源代码的工具。解释器会直接读取源代码,并在运行时逐行或逐段地解释执行代码,不生成独立的目标代码文件。解释器适用于一些动态语言,允许用户在代码执行过程中进行交互,更容易调试…

【linux_常用的指令】

笔记 1连接远程主机2 两台主机间复制2.1 查看当前目录2.2 普通复制 3 创建能运行sudo命令的用户3.1 更改用户admin的密码3.2 切换到admin用户,并且启动一个新的shell3.3 更改文件或目录的权限 4 切换目录5 解.tar.gz格式的压缩包6 运行.sh文件7 查看当前目录的所有文…

泛型中K T V E ? Object等分别代表的含义

E – Element (在集合中使用,因为集合中存放的是元素) T – Type(Java 类) K – Key(键) V – Value(值) N – Number(数值类型) ? – 表示不确定的java类型&…

一个月速刷leetcodeHOT100 day07 轮转数组 除自身以外的乘积 找到字符串中所有字母异位词

轮转数组 给定一个整数数组 nums,将数组中的元素向右轮转 k 个位置,其中 k 是非负数。 示例 1: 输入: nums [1,2,3,4,5,6,7], k 3 输出: [5,6,7,1,2,3,4] 解释: 向右轮转 1 步: [7,1,2,3,4,5,6] 向右轮转 2 步: [6,7,1,2,3,4,5] 向右轮转 3 步: […

系统思考—跳出症状看全局

结束了《系统思考—跳出症状看全局》的迭代课程后,我感触颇深。通过一个深入的案例研讨、互动讨论和实战演练,学员们不仅更好地理解了如何跳出症状看全局,还掌握了制定更具前瞻性和可持续性策略的方法。我们还探讨了如何在实际工作中应用这些…

《python编程从入门到实践》day38

# 昨日知识点回顾 定义、迁移模型Entry # 今日知识点学习 18.2.7 Django shell 每次修改模型后,看到重启后的效果需要重启shell,退出shell会话Windows系统按ctrlZ或者输入exit() 18.3 创建页面:学习笔记主页 创建页面三阶段&#xf…

介绍一下Hugging Face,这个公司的背景是什么

Hugging Face是一家成立于2016年的人工智能公司,专注于为AI研究人员和开发者提供开源模型库和工具。以下是关于Hugging Face公司的详细背景介绍: 公司历史与创始人: Hugging Face由Clment Delangue、Julien Chaumond和Thomas Wolf三位法国籍…

E0144 “const char *“ 类型的值不能用于初始化 “char *“ 类型的实体

解决方案: 在Visual Studio中,在项目上右键,属性 >> C/C >> 语言 >> 符合模式,改为“否”。