自定义动画,创意无限。

摘要

画圆,如同画人生,每一笔都是独特的,每一步都是不同的。就像这个例子,我们用心绘制大圆,让它在画布上跳跃,感受它的移动,感受它的生命力。

正文

详讲自定义动画的实现

动画只需要连续绘制图片就可以形成动画,那么就可以改变参数,使参数连续变化就可以形成动画了

以移动圆为例:

//画大圆的paint
private val paintBigCircle: Paint by lazy {
Paint().apply {
style = Paint.Style.FILL
color = Color.RED
}
}
canvas?.drawCircle(200f,200f,100,paintBigCircle)
绘制一个圆,前两个(200f,200f)是圆的中心位置,
现在需要圆在水平方向上的移动动画,就定义一个浮点数类型代替200f,
private var smallCircleX = 0f
将上面的绘制圆改成
canvas?.drawCircle(smallCircleX,200f,100,paintBigCircle)
使得圆在水平方向上运动就只需要改变圆距离x轴的距离,也就是圆中心x的位置
这时就可以与ValueAnimator(属性动画,之前有写)连起来用,可通过监听
其数据变化,来赋值改变参数的变化
//小球移动的动画
valueAnimatorSmallCircle = ValueAnimator.ofFloat(0f,5.5f*87.5f).apply {
duration = 1000L
repeatCount = INFINITE
addUpdateListener {
it.animatedValue :是获取动画的value值,在这里就是0f,到5.5f*87.5f之间的值
val value = it.animatedValue as Float
smallCircleX = smallCircleBigX - value 将值赋给参数,改变其状态
invalidate() 刷新界面,这时就会重新调用onDraw方法,重新绘制,绘制的值就是新的smallCircleX的值,
整个过程连起来就行形成动画
}
}.start() //启动动画,启动的是valueAnimatorSmallCircle的value值的变化


关注不迷路

扫码下方二维码,关注宇凡盒子公众号,免费获取最新技术内幕!

温馨提示:如果您访问和下载本站资源,表示您已同意只将下载文件用于研究、学习而非其他用途。
文章版权声明 1、本网站名称:宇凡盒子
2、本站文章未经许可,禁止转载!
3、如果文章内容介绍中无特别注明,本网站压缩包解压需要密码统一是:yufanbox.com
4、本站仅供资源信息交流学习,不保证资源的可用及完整性,不提供安装使用及技术服务。点此了解
5、如果您发现本站分享的资源侵犯了您的权益,请及时通知我们,我们会在接到通知后及时处理!提交入口
0

评论0

请先

站点公告

🚀 【宇凡盒子】全网资源库转储中心

👉 注册即送VIP权限👈

👻 全站资源免费下载✅,欢迎注册!

记得 【收藏】+【关注】 谢谢!~~~

立即注册
没有账号?注册  忘记密码?

社交账号快速登录