带你走一遍自定义View之旅——效果图
当你看完这篇博客过后,相信你已经可以摸到自定义View的门道了,本篇博客将带你走一遍自定义View之旅废话不多说先上效果图。
(资料图)
实现思路
1. 创建attrs.xml文件,自定义一些我们需要的属性,对于format的取值大家可以搜索一下网上有很多教程,我这里就不重复造轮子了。
2.定义好了我们的属性,那么我们就需要在我们的view中加载它,这样我们在布局中使用自定义的属性就有效果如下代码:
/** * 在两个参数的构造函数中加载我们在attrs.xml文件的自定义的属性 */ private void loadAttrs(Context context, AttributeSet attrs) { TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.a_zhon); paintBold = array.getDimensionPixelSize(R.styleable.a_zhon_paintBold, 10); lineLength = array.getDimensionPixelSize(R.styleable.a_zhon_lineLength, 25); bgPaintColor = array.getColor(R.styleable.a_zhon_backgroundColor, Color.GRAY); beforePaintColor = array.getColor(R.styleable.a_zhon_beforeColor, Color.YELLOW); lines = array.getInt(R.styleable.a_zhon_lines, 20); max = array.getInt(R.styleable.a_zhon_max, 100); progress = array.getInt(R.styleable.a_zhon_progress, 0); textColor = array.getColor(R.styleable.a_zhon_textColor, Color.BLACK); array.recycle();//TypedArray需要被回收 }
3.我们需要重写onMeasure函数来获取View在布局中所占的大小
@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); //获取view的宽度 mWidth = getViewSize(100, widthMeasureSpec); //获取view的高度 mHeight = getViewSize(100, heightMeasureSpec); }
measureSpec中包含测量模式和宽高信息,这里大家看注释大概就能懂了
/** * 测量模式 表示意思 * UNSPECIFIED 父容器没有对当前View有任何限制,当前View可以任意取尺寸 * EXACTLY 当前的尺寸就是当前View应该取的尺寸 * AT_MOST 当前尺寸是当前View能取的最大尺寸 * * @param defaultSize 默认大小 * @param measureSpec 包含测量模式和宽高信息 * @return 返回View的宽高大小 */ private int getViewSize(int defaultSize, int measureSpec) { int viewSize = defaultSize; //获取测量模式 int mode = MeasureSpec.getMode(measureSpec); //获取大小 int size = MeasureSpec.getSize(measureSpec); switch (mode) { case MeasureSpec.UNSPECIFIED: //如果没有指定大小,就设置为默认大小 viewSize = defaultSize; break; case MeasureSpec.AT_MOST: //如果测量模式是最大取值为size //我们将大小取最大值,你也可以取其他值 viewSize = size; break; case MeasureSpec.EXACTLY: //如果是固定的大小,那就不要去改变它 viewSize = size; break; } return viewSize; }
4.准备工作都做好了(这里省略了一些画笔和属性初始化详情见我源码),接下就先开始绘制底层的菊花
int x = mWidth / 2; int y = mHeight / 2; int r = x - 5; for (int i = 0; i < lines; i++) { //绘制下层菊花 canvas.drawLine(x, y - r, x, y - r + lineLength, bgPaint); canvas.rotate(360 / lines, x, y); }
5.继续绘制上层菊花,也就是加载的进度
//获取需要绘制多少个刻度 int count = (progress * lines) / max; //绘制中间的文字进度 canvas.drawText((progress * 100) / max) + "%", x, y + 5, textPaint); //绘制上层菊花,也就是进度 canvas.rotate(360 / lines, x, y); for (; count > 0; count--) { canvas.drawLine(x, y - r, x, y - r + lineLength, bfPaint); canvas.rotate(360 / lines, x, y); }
6.为了达到图中第二个菊花进度的效果,我们需要在内部定义一个动画提供给使用者。这里使用的是ValueAnimator想详细了解的可以搜索一下网上资料也非常多在这里也就不重复造轮子了。
/** * 为进度设置动画 * ValueAnimator是整个属性动画机制当中最核心的一个类,属性动画的运行机制是通过不断地对值进行操作来实现的, * 而初始值和结束值之间的动画过渡就是由ValueAnimator这个类来负责计算的。 * 它的内部使用一种时间循环的机制来计算值与值之间的动画过渡, * 我们只需要将初始值和结束值提供给ValueAnimator,并且告诉它动画所需运行的时长, * 那么ValueAnimator就会自动帮我们完成从初始值平滑地过渡到结束值这样的效果。 * * @param start 开始值 * @param current 结束值 * @param duration 动画时长 */ public void startAnimation(int start, int current, int duration) { ValueAnimator progressAnimator = ValueAnimator.ofInt(start, current); progressAnimator.setDuration(duration); progressAnimator.setTarget(progress); progressAnimator.setInterpolator(new BounceInterpolator()); progressAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { progress = (int) animation.getAnimatedValue(); invalidate(); } }); progressAnimator.start(); }
7.同时对外提供两个方法,设置最大进度和当前进度
/*设置进度最大值*/ public void setMax(int max) { this.max = max; invalidate(); } /*设置当前进度*/ public void setProgress(int progress) { this.progress = progress; invalidate(); }
8.基本上这个View就说完了,我们就可以开始在布局中使用了一起来看看吧!
<COM.ZSY.ROATE.LOADINGVIEW android:layout_width="80dp" android:layout_height="80dp" a_zhon:backgroundcolor="#9f9c9c" a_zhon:beforecolor="#1dcdef" a_zhon:linelength="10dp" a_zhon:lines="20" a_zhon:max="100" a_zhon:paintbold="3dp" a_zhon:progress="70"
最后来个Demo传送门亲!如果觉得不错就顶一下吧
标签:
相关推荐:
最新新闻:
- 可以搜附近人的交友软件有哪些?有哪些靠谱的交友软件?
- 如何查询appInfo、appName?appInfo查询方法_当前关注
- SP2的系统怎么操作?如何使用SP2的系统文件?
- QQ.COM二级域名大全 腾讯旗下产品大全
- 每日消息!泛域名证书不起作用?主机绑定多个域名就可以了
- 带你走一遍自定义View之旅——效果图
- 在pycharm中运行代码时显示下面错误如何解决?
- 《绝地求生》主播打造3A级开放世界生存游戏新作 世界观热点
- 今年夏季《忍者小子》将改编成四人合作动作游戏
- 环球新动态:性价比绝了!中兴小方糖双频千兆路由器99元
- 不怕偷 哈罗电动车2373元
- 长江存储颗粒!梵想S500PRO 2TB M.2固态硬盘低至579元|环球观察
- 又曝大Bug!Windows 11会导致SSD速度降低
- 清仓大促销!AMD R5-5500板U套装低至789元
- 每日资讯:Roguelike策略卡牌游戏《河口蟾蜍》面向PC公布
- Epic喜+1:策略游戏《战锤40K:角斗士之战争圣器》 下周送《终极象棋》
- 《红霞岛》公布剧情预告 5月2日正式发售 快讯
- 阿斯报:维尼修斯将视频出庭指证种族主义辱骂他的马洛卡球迷:要闻
- 【环球新视野】《迪士尼竞速风暴》将于4/18以抢先体验形式推出
- 2023年科隆展将迎来一个大厂回归 有更多公司参加-天天亮点
- 湖北省黄石市市场监管局抽检食品42批次 1批次不合格
- 环保少女偷删世界末日预言推文 曾称人类会被毁灭_全球今亮点
- 外媒:《GTA6》应加入私服 因为《GTAOL》私服很火
- 【全球独家】DLSS3普及速度更快:《暗黑4》《极限竞速:地平线5》和虚幻5.2
- 英国有6家游戏公司支持微软收购 只有索尼不支持
- 全球观速讯丨小米智能鱼缸399元开售 支持半年免换水 远程喂鱼
- 本田召回近45万辆汽车 安全带自己会开
- 特斯拉Model 3改装120寸大轮毂:暴力测试来了
- 天禄科技(301045):关于召开2023年第三次临时股东大会,审议《关于公司符合向特定对象发行股票条件的议案》等议案
- 观速讯丨现实版GTA?美国劫匪偷直升机因操作失误当场坠毁
- 《最终幻想起源:天堂的陌生人》4月登陆Steam-全球观点
- 张译新剧《他是谁》豆瓣大量好评!张译演技绝了-简讯
- 确有其事还是开玩笑?刘德华将导演成龙吴京电影 世界热头条
- 今日播报!外星人 m16 游戏本 RTX4050/4060/4070 开卖:15999 元起
- 今日精选:iPhone 14黄色版跌到5200 卖的格外好
- 即时焦点:马自达CX-50开售:58分钟卖出2000台
- 世界最新:一段“诡异录像”里 藏着一位波兰小伙的游戏梦
- 快看:微软与多家游戏平台签署COD协议 网友:就剩索尼了
- 【天天播资讯】《最后生还者》艾莉妈妈演员晒幕后照:化妆超逼真
- 诚信是老字号立身之本:环球视讯
- “绵阳造”上海行 长虹激光携光影耀申城
- 找工呀受邀参加汽车行业人资峰会,展示硬核招聘实力_环球微动态
- 环球今日报丨立省195元!16GB内存条崩盘价174元
- 汉印照片打印机CP2100:随心所印,留存美好
- 闪购价,哈曼卡顿水晶 3 代音响仅售 999 元|焦点精选
- 卡普空《恐龙浩劫》公测开启 残暴恐龙大军来袭
- 环球微速讯:《生化危机4:重制版》艾达王篇和佣兵模式或以DLC形式推出
- 文心一言秒变毕加索 看看百度AI画的青春校园女孩
- 当前视讯!游民专访周董...的卫冕电竞战队Jteam
- 每日观察!提前尝鲜!参与京东“先人一步”提前到手Find X6系列新机
- 调教Siri!苹果入局人工智能_环球微头条
- 王者荣耀体验服爆料:新增姐弟关系,基友关系改名
- 优势互补、携手共赢|极智嘉(Geek+)合作九州云智
- 每日观察!提前尝鲜!参与京东“先人一步”提前到手Find X6系列新机
- 环球精选!手游太赚钱!去年苹果手游收入几乎等于Xbox总收入
- 当前关注:11bit推出超豪华捆绑包 工作室所有作品打包卖95元
- 文心一言已有650家合作伙伴接入:内测并不完美
- 天天观速讯丨《机动战士高达:激战任务2》下载量突破500万 官方举办感谢活动
- Steam2023春季促销有哪些游戏?Steam春促2023哪些游戏打折?
- 感觉还不错 《生化危机4重制版》第一人称mod 世界实时
- 10股特大单净流入资金超2亿元_今日热闻
- 天天最新:看看有没有你的手机!MIUI 14第三批正式发布,共有18款手机机型在名单中
- 品质永不过时,A.O.史密斯加力打造智能舒适家居放心服务:天天热闻
- 对信息泄露和定位跟踪说“再见”,TD Tech F4智防手机护你安全出行
- 全球即时看!幼升小护眼台灯首选,看状元郎宽面学习台灯如何凭实力出圈
- 脑机接口产业技术路线图研究项目专家研讨会在沪顺利召开:天天热讯
- 山雨欲来风满楼 友谊时光新游《浮生忆玲珑》PV首曝
- 天天快消息!《最后生还者》艾莉声优盛赞小熊女演技:没人比她更适合这个角色
- 世界观天下!粉丝喊话《真人快打12》加入艾莉 开发商:我拒绝 不愿看到艾莉受伤害
- 音乐解谜游戏《Backbeat》现已登陆Steam平台
- 《暗黑破坏神4》公布抢先测试首个世界Boss活动时间:全球新资讯
- 免费打谱软件 AnthemScore:免费的钢琴谱软件
- 爬取网络上的海量数据有哪些?爬取网络上的海量数据如何正确选取?-全球热闻
- 世界今头条!怎么清除电脑个人隐私?电脑隐私清理软件WipePro
- 卡巴斯基7.0最新激活码(KA5ZP3-3H9)
- flash动画背景透明的方法 MG动画制作|万彩动画大师_当前简讯
- 微信占用内存太大怎么办?微信如何清理空间?-全球即时看
- 【生活百科】吸湿盒和除湿包哪个更好用?:天天快讯
- 微信抢红包怎么抢最佳?从青铜级到王者级的操作招式-信息
- 怎样安装安卓平板电脑软件?安装安卓平板电脑软件的注意事项有哪些?
- 天天讯息:支付宝宁波银行快捷支付如何开通?支付宝快捷支付开通流程
- 分治思想的核心是什么?简述递归和分治的关系
- NDK移植编译 android-ndk-r10dNDK基本流程-全球时讯
- 钉钉内置的“群直播”功能怎么用?教你一招-全球报资讯
- 环球速读:【教程】PyTorch中文版官方教程出炉