Android 自定义 view 动画按钮

Android 自定义 view 动画按钮,第1张

概述昨天偶偶然看见UI给的一个交互的效果,原图如下就是下面的loginbutton,于是大概模仿了一下,并没有做这个UI的全部效果,有兴趣的可以完善后面展开的效果下面是demo的button效果这个View用到的知识点比较简单:view的坐标系知识,(大家没有不熟悉的吧)view的canvas基本API(画矩形,画扇

昨天偶偶然看见UI 给的一个交互的效果,原图如下

就是下面的loginbutton,于是大概模仿了一下,
并没有做这个UI的全部效果,有兴趣的可以完善后面展开的效果

下面是demo的button效果

这个VIEw用到的知识点比较简单:

vIEw的坐标系知识,(大家没有不熟悉的吧)

vIEw的canvas基本API(画矩形,画扇形,)

vIEw的自定义属性(attr提供选项)

属性动画的知识(老生常谈的知识,ObjectAnimation和ValueAniamtion)

下面我们就一步步实现这个button

我们写一个自定义的类继承VIEw实现其构造,在构造函数中获取自定义属性的值


重写vIEw的onMeasue,确定和测量我们vIEw的大小和测试模式的确定


然后获取测量后vIEw的宽和高


然后就是最后一步了onDraw,几分钟,我们已经完成了百分之80的工作
最后20%就是让vIEw的内容画到画布上,并且让其动起来就ok了

画圆形的button,注意这个圆角button,动起来的时候量个半圆需要合并成一个完整的圈,所以倒角的半径就已经确定了,就是我们vIEw高度的一半,这里需要注意下


画button上面的文字


小插曲,我们在绘制文字的时候为了让文字居中,我们需要获取文字测量后的信息如下


画扇形的方法,这个方形就是我们那个loading的圆圈


ok到现在我们所有的图形元素都准备到位,剩下的就是提供两个方法,一个是开始登陆,button变成圆形,还有一个就是登陆的结果不管失败还是成功都要变成button,以及还有一个在变成圆球的时候旋转的动画

一步步来

然后就是类似的一个方法,圆圈变成button的方法


这样我们vIEw的全部工作都做完了,剩下的就是在Mainactivity里面用一下


由于 就一个这个demo就一个自定义view,项目就不上传了,把完整的代码给大家,有兴趣的可以放到AS里面跑一下,谢谢!

总结

以上是内存溢出为你收集整理的Android 自定义 view 动画按钮全部内容,希望文章能够帮你解决Android 自定义 view 动画按钮所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1002372.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-22

发表评论

登录后才能评论

评论列表(0条)

保存