【安卓自定义控件系列】自绘控件打造界面超炫功能超强的圆形进度条

2023-05-16


在前面我们讲过了安卓自定义控件三种方式中的组合控件,现在我们来讲解一下通过自绘的方式来实现自定义控件,本博客将以自定义圆形进度条为例向大家讲解自定义控件的知识,首先来看一下效果图吧,这个是本人自定义圆形进度条demo工程的运行截图:



首先说一下自己这个自定义圆形进度条要达到的目标:

1能够支持设置进度条各种属性,如圆环的大小,颜色,进度条的大小,颜色,进度条的颜色支持设置三种颜色来达到渐变色的效果。

2圆形进度条的内部支持设置三层文本,即上层的标题,如上图的“您的等级超越全国”,中间层的进度值,如上图的“700”,下层的附带内容,如上图的“万的用户”

3支持设置三层文本的大小与颜色,如上图标题与底部文本为黑色,中间文本为红色

4支持进度条从任意位置开始显示,为何要支持该功能,是因为在不同的场合,进度条开始显示的位置一般是不同的,如在某些手机助手类下载App的应用中显示下载进度的时候都是从圆环的顶部开始,以顺时针为方向逐渐递增显示,本例的第三个小圆环即是模仿的该场合,但是因为截的动态图上传出错,只能上传几张图片,所以看的不是很清楚,而在某些计步器类的app中进度的绘制一般是从左下角开始显示,然后以顺时针为方向达到对称的位置,本例的最后一个大圆环即是模仿的该场合。

5支持设置部分圆弧,而不是整个圆,如本例的最后一个大圆环的进度条显示效果,因为在某些场合是不需要绘制整个圆的,如在模拟汽车速度表盘的场合。

6具备极强的自适应能力,即wrap_content参数要能够比较完美的适应用户输入的文本的长度。


在做这个自定义控件的工程时也遇到了一坑,不过都一一解决了,其中最难的就是最后一条,要求具备极强的自适应能力,即当我们在xml文件中指定该自定义控件的宽度与高度为wrap_content时如何完美的适应用户输入的文本,这个是关键,这涉及到安卓中控件的绘制过程的知识和一些绘图API的使用,主要是paint与draw这两个类的API,而本人完美解决wrap_content涉及到了paint类中某些不常用的API,因此说这也是难以解决的一个原因,你必须对paint类的API非常熟悉,即使是相对而言很少使用的。

因为本人已打算将该组件开源,上传到我的github上,大家可以到我的github上去fork我的代码,因此本博客不是对整个自定义圆形进度条做讲解,因为这没啥难度,另外网上很多这些方面的博客,本博客重点讲解如何解决极强的自适应能力,因此下面重点说一下如何解决wrap_content.


在贴出自己解决方案的代码之前,先给大家普及一下关于安卓中控件的绘制过程,因为你明白了这个过程才知道如何去解决wrap_content.

我们知道安卓中一个控件要显示在界面上要经过三个过程,即测量,布局与绘制,对应onMeasure,onLayout,onDraw这三个函数,很显然我们要解决的是测量过程,即当在xml中设置wrap_content的时候如何较准确的测量出我们自定义控件的大小,在安卓中一个控件的大小用MeasureSpec这个类来表示所,测量过程实际上可以说是得到该控件的MeasureSpec的过程。下面是一些关于MeasureSpec类的常识:

- MeasureSpec是通过将一个int(32)的数组成而成的,本质是一个int数,MeasureSpec由两部分组成:SepcMode 和 SpecSize 。其中SpecMode为MeasueSpec的高2位,SpecSize为MeasureSpec的低30位。SpecMode有3类:

 - UNSPECIFIED:父容器不对View有任何限制,要多大有多大,这种情况一般用于系统内容。在我们使用过程中,一般不考虑这种模式。
 - EXACTLY:父容器已经检测到了View所需要的精确大小,这个时候View的最终大小就是SpecSize所指定的大小。它对应的LayotParams中的match_parent 和具体的数值。
 - AT_MOST: 父容器指定了一个可用大小SpecSize,View的大小不能大于这个值,它对应于LayoutParams中的wrap_content。

一个子控件的MeasureSpec与父容器的MeasureSpec和自身的LayoutParams相关,由二者共同决定。一个子控件的onMeasure方法一般由其父容器所调用,代码如下:

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
                getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));
    }
public static int getDefaultSize(int size, int measureSpec) {
        int result = size;
        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);
        switch (specMode) {
        case MeasureSpec.UNSPECIFIED:
            result = size;
            break;
        case MeasureSpec.AT_MOST:
        case MeasureSpec.EXACTLY:
            result = specSize;
            break;
        }
        return result;
    }

从上面的代码可以看到AT_MOST和EXACTLY两种模式都会被设置成specSize。我们也知道AT_MOST对应于wrap_content,而EXACTLY对应于match_parent和具体数值情况。也就说默认情况下wrap_content和match_parent是具有相同的效果的,这也是为何说在我们通过继承自View类自绘的方式自定义控件的时候为何需要自己支持wrap_content的原因。

知道了原因我们就知道要解决的话则应该重写自定义控件的onMeasure函数,在该函数中为自定义控件设置一个默认的宽与高即可,但是为了做到极强的自适应,这个宽与高必须非常恰当,那么怎样才算恰当呢?这个就和自定义控件的功能相关,如本人自定义控件中要求支持三层文本显示,那么很显然所谓的恰当就是刚好能够容纳这三行文本中的最大长度的文本,因此此时解决思路就转换为了如何求自绘文本的长度,这个涉及到了Paint类中的一个API getTextBounds,通过该API就可以知道文本的长度,从而较好的支持wrap_content,下面是解决wrap_content的完整代码,注释很详细,大家应该可以看懂。

	 //必须重写该方法,否则在xml文件中定义warp_content与match_parent效果相同
	@Override
	 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

		 super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		 int desiredWidth ;
		 int desiredHeight ;
		 
     //设置了文本,且属性为wrap_content,那么以输入的文本的长度为宽度
		 if (isSetToptitle) {
		 Rect rect = new Rect();  
		 titlePaint.getTextBounds(topTitle, 0, topTitle.length(), rect); 
//		 desiredWidth =(int) (rect.width()+4*progressWidth);
//		 desiredHeight = (int) (rect.width()+4*progressWidth);
		 desiredWidth =(int) (1.5*rect.width());
		 desiredHeight = (int) (1.5*rect.width());
		 }
		 else//没设置文本那么不可能设置wrap_content属性,事实上这些设置无效
		 {
			 desiredWidth =500;
			 desiredHeight = 500;
		 }
		    
		    int widthMode = MeasureSpec.getMode(widthMeasureSpec);
		    int widthSize = MeasureSpec.getSize(widthMeasureSpec);
		    int heightMode = MeasureSpec.getMode(heightMeasureSpec);
		    int heightSize = MeasureSpec.getSize(heightMeasureSpec);

		    int width;
		    int height;

		    //Measure Width
		    if (widthMode == MeasureSpec.EXACTLY) {
		        //Must be this size
		        width = widthSize;
		    } else if (widthMode == MeasureSpec.AT_MOST) {
		        //Can't be bigger than...
		        width = Math.min(desiredWidth, widthSize);
		    } else {
		        //Be whatever you want
		        width = desiredWidth;
		    }

		    //Measure Height
		    if (heightMode == MeasureSpec.EXACTLY) {
		        //Must be this size
		        height = heightSize;
		    } else if (heightMode == MeasureSpec.AT_MOST) {
		        //Can't be bigger than...
		        height = Math.min(desiredHeight, heightSize);
		    } else {
		        //Be whatever you want
		        height = desiredHeight;
		    }

		    //MUST CALL THIS
		    setMeasuredDimension(width, height);
		    
		    center = getWidth()/2; //该方法必须在onDraw或者onMeasure中调用,否则不起作用d
	        
			//圆环的半径 ,此处必须是progressWidth与circleWidth中较大的一个
		    //radius = (int) (center - progressWidth/2); 
			if(progressWidth>circleWidth)
			  radius=(int)(center-progressWidth/2);
			else
			  {radius=(int)(center-circleWidth/2);}
	        
	       
	        sweepGradient = new SweepGradient(0, 0, colors, null);
	        hideRect=new RectF(center - radius, center - radius, center  
	                + radius, center + radius); 

		}

至于其它属性因为很简单,无非就是在atrs文件中定义属性,在构造函数中通过context.obtainStyledAttributes得到一个TypedArray,然后通过TypedArray获取属性,重写onDraw函数,在该函数中处理这些获取到的属性而已,不涉及到很多原理上的思考,另外网上关于这方面的资料也很多,所以没贴出代码,大家如果感兴趣可以follow我的github账号,本人将上传该项目工程到我的github上,这个应该是目前github上开源的相关组件中功能最强大的自定义圆形进度条了,欢迎大家follow,star与fork。


我的github:https://github.com/HuTianQi

如果大家觉得不错记得小手一抖点个赞哦,欢迎大家关注我的博客账号,将会不定期为大家分享技术干货,福利多多哦!


本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【安卓自定义控件系列】自绘控件打造界面超炫功能超强的圆形进度条 的相关文章

  • 串口缓冲区管理分析

    一 概述 xff1a 串口使用时一般包含两个缓冲区 xff0c 即发送缓冲区和接收缓冲区 发送数据时 xff0c 先将数据存在发送缓冲区 xff0c 然后通过串口发送 xff1b 接收数据时 xff0c 先将接收的数据存在接收缓冲区 xff
  • JLINK给STM32下载的两种模式--jtag & sw连线及配置

    jtag线就不说了 xff0c 将jlink的Vref GND TMS TCK分别接至SW接口 对于STM32F103RCT6来说 xff1a TMS PA12 xff0c TCK PA14 关于KEIL MDK中的设置如下图所示就可以了
  • 3.3V过压保护电路

    好久没写了 xff0c 今天就写一些工作中用到的一个电路 3 3V过压保护电路 通常一个电路中给单片机等对电压信息敏感的器件供电时都会小心翼翼 xff0c 严防前级降压电路出问题 xff0c 我就碰到过12V转5V的1117奔溃记过加在ST
  • eagle使用注意点

    使用eagle也有快一年时间了 xff0c 刚开始很不习惯 xff0c 后来习惯了也还可以 xff0c 这里我举出几个设计中经常出错的地方 xff1a 1 PCB翻转问题 xff1a 在翻转PCB文件时一定要打开torigin borigi
  • 自制pixhawk电脑不识别com口

    在原版pix上面进行改版很方便 xff0c 可以去除很多不必要的电路 笔者将电源管理芯片去除 xff0c 5V来源于变压器输出或者是连接电脑时的USB供电 xff0c 并将它们并联起来 xff0c 但是板子做回来焊接后发现问题如下 xff1
  • eagle pcb v8.2 便捷性大大提升

    eagle pcb在被Autodesk收购之前是7 x版本 xff0c 但是却有一些一直被吐槽的东西 xff0c 说实话这些东西确实增加了布线难度 xff0c 增加了布板时间 xff1a 1 real time DRC xff1a 在7 x
  • Ubuntu firefox 显示在运行无法打开,如何在终端关闭进程

    用top命令找不到firfox的进程 xff0c 查看某个用户运行的进程 xff1a ps u username grep eclipse 查看用户名为 xff1a username 的用户是否运行了eclipse 查看用户当前运行fire
  • 【万字详解】cJSON解析

    目录 1 通过README文件 xff0c 初步了解cJSON xff1a 1 1 头文件的开头和结尾 xff1a 1 2 头文件关于cJSON类型的宏定义 1 3 头文件中的extern 2 阅读并且分析cJSON源码 2 1 结构体st
  • VINS-mono 解析 新特征

    在17 12 29 xff0c VINS更新了代码加入了新的特征 xff0c 包括map merge 地图合并 pose graph reuse 位姿图重利用 online temporal calibration function 在线时
  • VINS-mono 位姿图 重利用测试

    在前一篇博文里介绍了VINS mono pose graph reuse功能的使用 xff0c 这里接着贴出一些延伸的测试 xff0c 并进行一些探讨 延伸测试 一般来说 xff0c 加载地图是进行非GPS定位必要的一步 这里根据新的VIN
  • 2022年全国大学生电子设计大赛省赛A题

    2022年全国大学生电子设计大赛省赛A题 交流电子负载 文章目录 2022年全国大学生电子设计大赛省赛A题 交流电子负载 前言一 总体思路二 模块设计1 半桥模块2 测量模块3 辅助电源模块 三 主电路搭建总结 前言 2022年全国大学生电
  • linux下使用shell发送http请求

    一 curl 1 get请求 curl命令默认下就是使用get方式发送http请求 curl www baidu com 2 post请求 使用 d参数 xff0c 形式如下 xff1a curl d 34 param1 61 value1
  • 网络摄像头 接口协议 ONVIF,PSIA,CGI,ISAPI

    ONVIF致力于通过全球性的开放接口标准来推进网络视频在安防市场的应用 xff0c 这一接口标准将确保不同厂商生产的网络视频产品具有互通性 2008年11月 xff0c 论坛正式发布了ONVIF第一版规范 ONVIF核心规范1 0 随着视频
  • VLC架构及流程分析

    注明 xff1a 此文为转载 原文地址 xff1a https jiya io archives vlc learn 2 html 由于本人之前由于在工作中需要对VLC进行二次开发 因此进行了相关工作的开发 xff08 由于工作原因 目前暂
  • 学习、使用C++开发是不是过时了?

    C 43 43 在开发过程中真心很尴尬 1 拿相同薪水使用不同语言的程序员 xff0c 开发大多数相同的常见业务需求 xff0c C 43 43 总是进度较慢 xff08 不考虑时 空复杂性及效率 xff09 2 扩展性 跨平台 资源 内存
  • strcat()函数的用法

    这几天的一次程序练习中用到了strcat 函数 xff0c 但也想到了一些问题 我们都知道strcat str ptr 是将字符串ptr内容连接到字符串str后 xff0c 然后得到一个组合后的字符串str xff0c 比如 str字符串内
  • libQtCore.so.4 undefined symbol :g_main_context_push_thread_default

    开发板终端执行qt程序 qtDemo qws 报错 xff1a libQtCore so 4 undefined symbol g main context push thread default 解决方案 xff1a cd DVSDK p
  • curl时设置Expect的必要性

    curl 在项目中使用频率较高 xff0c 比如内部接口 第三方 api 图片存储服务等 xff0c 但是我们在使用 curl 时可能并没有注意到 Expect 这个请求头信息 xff0c 而 Expect 设置不正确 xff0c 会导致不
  • 奇偶校验原理

    奇校验 xff1a 求一个字节8位中 1 的个数 xff0c 添加一位校验位 xff0c 使9位中 1 的个数为奇数 xff1b 偶校验同理 奇校验就是让原有数据序列中 xff08 和要加上的一位 xff09 1的个数为奇数 如010001
  • CreateMutex函数函数用来实现进程互斥

    CreateMutex函数 正常情况下 xff0c 一个进程的运行一般是不会影响到其他正在运行的进程的 但是对于某些有特殊要求的如以独占方式使用串行口等硬件设备的程序就要求在其进程运行期间不允许其他试图使用此端口设备的程序运行的 xff0c

随机推荐

  • C++与QML交互总结

    一直对于QT的理解和使用都停留在主窗口程序和控制台程序 xff0c 虽然QT的新东西QML听过也接触过 xff0c 但是基本上没梳理过调用流程 趁着旧项目要使用QML技术 xff0c 现在就将C 43 43 和QML交互进行总结 目录 一
  • QT下TCP协议实现数据网络传输

    QT开发框架以其跨平台的优势 xff0c 在全世界IT界如雷贯耳 其封装了功能齐全的各种类 xff0c 大大的提高了开发者的效率 本篇内容将介绍如何使用QT 6 4 1框架开发服务器和客户端程序 xff0c 让两端能够首发消息 xff0c
  • 从零实现vins-mono+fast-planner+M100无人机实验在现实场景中的应用

    版权声明 本文为博主原创文章 未经博主允许不能随意转载 本文链接 https blog csdn net AnChenliang 1002 article details 109535355 最近由于科研的需要 要将VINS mono与fa
  • Linux下C语言实现HTTP文件服务器和TCP协议实现网络数据传输

    在实际开发中经常用到web框架 xff0c 比如Servlet xff0c SpringBoot等 xff0c 这些开发框架提高了我们的开发效率 xff0c 节省了开发时间 但是这会令我们技术人员处于浮云之上 xff0c 看不到其本质 说实
  • Linux下C语言UDP协议通信实践

    UDP和TCP协议一样 xff0c 都是传输层协议 是无连接的 xff0c 不安全的 xff0c 报式传输层协议 xff0c 通信过程默认也是阻塞的 其通信特点主要如下 xff1a xff08 1 xff09 不需要建立连接 xff0c 所
  • Ubuntu下PyQt5使用总结

    因为工作中需要给交付团队开发桌面工具 xff0c 考虑到交付团队多使用Mac xff0c 调研了一下发现PyQt5可以实现跨平台 xff0c 满足工具开发需要 xff0c 就用其开发了桌面工具 现以ubuntu开发环境为例总结一下开发过程
  • ubuntu下安装配置grpc

    目录 1 准备环境 2 安装protobuf 3 安装cares库 3 安装grpc 1 17 x 1 准备环境 sudo apt get install pkg config sudo apt get install autoconf a
  • cmake管理子程序,lib库和so库应用实践

    cmake在管理大型项目时经常被用到 xff0c 本文以简单程序演示来说明camke管理项目应用 xff0c 其中包括主程序 xff0c 子程序 xff0c so库程序 xff0c lib程序 目录 1 程序目录结构 2 编译执行 3 清除
  • GIt常用命令总结

    目录 1 创建新建分支 2 强制拉去代码 3 合并相邻提交 xff0c 保证只有一个commit信息 4 本地回退 5 查看git修改列表 6 提交代码 7 切换新分支并从服务端拉取最新 8 git cherry pick合并代码使用 9
  • Linux 下I/O多路复用总结

    xfeff xfeff select xff0c poll xff0c epoll都是IO多路复用的机制 I O多路复用就通过一种机制 xff0c 可以监视多个描述符 xff0c 一旦某个描述符就绪 xff08 一般是读就绪或者写就绪 xf
  • WAV文件头分析

    WAV语音文件头部含有44字节的标志信息 xff0c 其含义如下 xff1a ckid xff1a 4字节 RIFF 标志 xff0c 大写 wavHeader 0 61 39 R 39 wavHeader 1 61 39 I 39 wav
  • Linux环境下限制网速和取消限制网速

    查看网卡信息 ip addr root 64 rabbitmq01 ip addr 1 lo lt LOOPBACK UP LOWER UP gt mtu 65536 qdisc noqueue state UNKNOWN qlen 1 l
  • Linux 网络编程2 TCP并发服务器

    Linux 网络编程学习 TCP IP网络编程2 TCP多线程服务器TCP多进程服务器 在前面TCP网络编程代码的基础上进行改造 xff0c 实现并发服务器功能 TCP多线程服务器 实现功能 xff1a server端可以绑定在任意IP端s
  • HTTP Digest authentication

    什么是摘要认证 摘要认证 xff08 Digest authentication xff09 是一个简单的认证机制 xff0c 最初是为HTTP协议开发的 xff0c 因而也常叫做HTTP摘要 xff0c 在RFC2617中描述 其身份验证
  • 简单的netfilter hook函数注册以及内核链表的使用

    include lt linux netfilter h gt include lt linux init h gt include lt linux module h gt include lt linux netfilter ipv4
  • 详述GPS原理及RTK技术应用

    完整的PPT文档在这里 xff1a 详述GPS原理及RTK技术应用 1 GPS概述 1 1定义 全球定位系统GPS xff08 Global Position System xff09 xff0c 全称为NAVSTAR GPS xff08
  • PHP HTTP Digest校验

    PHP作为客户端进行HTTP Digest校验 span class token comment 请求方法 span span class token variable username span span class token oper
  • Http Digest认证协议

    其认证的基本框架为挑战认证的结构 xff0c 如下图所示 xff1a xfeff xfeff 1 客户端希望取到服务器上的某个资源 xff0c 向服务器发送Get请求 2 服务器收到客户端的请求后 xff0c 发现这个资源需要认证信息 xf
  • Postman 安装

    Postman 的下载安装 Postman是一个用于构建和使用API的API平台 xff08 接口的调试工具 xff09 选择对应的系统和版本进行下载 https github com hlmd Postman cn 这里我的电脑是wind
  • 【安卓自定义控件系列】自绘控件打造界面超炫功能超强的圆形进度条

    在前面我们讲过了安卓自定义控件三种方式中的组合控件 xff0c 现在我们来讲解一下通过自绘的方式来实现自定义控件 xff0c 本博客将以自定义圆形进度条为例向大家讲解自定义控件的知识 xff0c 首先来看一下效果图吧 xff0c 这个是本人