随时开始随时结束的抽奖转盘

公司要实现点击抽奖开始动画,结果返回后缓慢停止到抽奖区域,在网上Google出来的大部分转盘demo都是等抽奖结果返回开启动画,经过两天的研究,可以随时开始与结束的转盘分享给大家(主要难点在于计算减速动画速度的计算)。

先上结果展示图(圆形转盘):

圆形转盘图,盗用网上素材,诸君莫怪

ps:圆形转盘因为性能的缘故在模拟器可能效果有些不理想,请以真机为主

来人呐,上代码:

点击开始按钮,开启定时器,无限执行旋转动画

无限旋转动画

点击停止按钮,首先停止无限旋转动画

停止无限旋转动画

在无限旋转的动画停止的回调里开启缓慢结束动画:

关键代码,根据减速过程的平均速度,计算减速时间

关键点:

1.为了确保最终指向的位置和无限旋转动画的位置之间的过程太短导致减速太突兀,所以减速动画会额外旋转一圈

2.random是模拟出的抽奖结果,计算出将要减速的路程一圈+抽奖结果,减速过程的平均速度为将要开始减速时的速度的一半(小学知识😭),路程/平均速度=减速时间,设置动画快进慢出,减速动画搞定。

以及老虎机样式的转盘

老虎机转盘的大致原理和圆形转盘的相同,参考代码。

代码下载