iOS 转盘抽奖游戏(原生)
转盘抽奖游戏在一般的app中都会有,应该算是一种吸引用户的一种手段。在项目中集成转盘抽奖游戏,大都采用h5的方式来实现,但是由于项目需求,需要在app中使用原生来实现转盘抽奖。实现原理也很简单,中间的一个图片姑且把它叫做转盘好了,当用户点击抽奖的时候,跟服务器做一次请求,拿到当前用户即将获得的奖品,根据奖品的位置,让转盘旋转对应的时间,和对应的圈数,最后定位到抽奖的位置,转盘结束转动,弹窗让用户知晓自己的中奖情况。
好了,废话说到这里,直接上效果图:

核心代码:
#define perSection M_PI*2/8
-(void)animationWithSelectonIndex:(NSInteger)index{
[self backToStartPosition];
self.startButton.enabled = NO;
self.needleImgView.image = [UIImage imageNamed:@"lottery_start_needle_noenable"];
self.textImgView.image = [UIImage imageNamed:@"lottery_state_zhong"];
CABasicAnimation *layer = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
//先转4圈 再选区 顺时针(所以这里需要用360-对应的角度) 逆时针不需要
layer.toValue = @((M_PI*2 - (perSection*index +perSection*0.5)) + M_PI*2*4);
layer.duration = 4;
layer.removedOnCompletion = NO;
layer.fillMode = kCAFillModeForwards;
layer.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
layer.delegate = self;
[self.gameBgView.layer addAnimation:layer forKey:nil];
}
-(void)backToStartPosition{
CABasicAnimation *layer = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
layer.toValue = @(0);
layer.duration = 0.001;
layer.removedOnCompletion = NO;
layer.fillMode = kCAFillModeForwards;
[self.gameBgView.layer addAnimation:layer forKey:nil];
}
#pragma mark - CAAnimationDelegate
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
//设置指针返回初始位置
self.startButton.enabled = YES;
self.needleImgView.image = [UIImage imageNamed:@"lottery_start_needle_enable"];
self.textImgView.image = [UIImage imageNamed:@"lottery_state_start"];
if (self.rotaryEndTurnBlock) {
self.rotaryEndTurnBlock();
}
}
更多源码请参考demo: https://github.com/qqcc1388/TYRotaryDemo
转载请标注来源:https://www.cnblogs.com/qqcc1388/p/9121877.html
iOS 转盘抽奖游戏(原生)的更多相关文章
- js实现大转盘抽奖游戏实例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery实现转盘抽奖
jquery实现转盘抽奖 一.总结 一句话总结:这里环形转盘,环形的东西可以化成线性的,然后访问到哪个,给他加上背景为红的样式,用定时器开控制转盘的速度,函数执行的时间间隔越小,就运动的越快. 1.如 ...
- 原生JS实现简易转盘抽奖
我爱撸码,撸码使我感到快乐. 大家好,我是Counter. 本章带大家来简单的了解下原生JS实现转盘抽奖. 因为主要涉及到JS,在这里HTML和CSS起到的功能就没有那么重要, 因此,没有过多的阐述H ...
- C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断
C#保留2位小数几种场景总结 场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...
- 原生js轮盘抽奖实例分析(幸运大转盘抽奖)
效果图: 所需图片素材: 这张图是pointer.png的位置的. turntable-bg.jpg这张是转盘背景图,在背景位置. 这张是turntable.png位置的. 需要这三张图片,如果要实现 ...
- web:转盘抽奖
移动web:转盘抽奖(幸运大转盘) 为了获取客户.回馈客户,平台一般会推出抽奖活动类的营销页.因此web页面中,有各式各样的抽奖效果. 格子式(九宫格),背景滚动式(数字/文字/图案),旋转式(转 ...
- 移动web:转盘抽奖(幸运大转盘)
为了获取客户.回馈客户,平台一般会推出抽奖活动类的营销页.因此web页面中,有各式各样的抽奖效果. 格子式(九宫格),背景滚动式(数字/文字/图案),旋转式(转盘),游戏式(砸蛋/拼图...).... ...
- 利用C# 窗体设计 写一个抽奖游戏
老师布置了一个任务,要求我们做一个抽奖游戏,以下是我个人制作的一个作品与写项目的过程. 我们用到了8个pictureBox控件和一个button,设置好大小,并且编排成一个九宫个形状 添加窗体的背景图 ...
- 【Vue.js游戏机实战】- Vue.js实现大转盘抽奖总结
大家好!先上图看看本次案例的整体效果. 实现思路: Vue component实现大转盘组件,可以嵌套到任意要使用的页面. css3 transform控制大转盘抽奖过程的动画效果. 抽奖组件内使用钩 ...
随机推荐
- 解决在win系统下使用DOS命令开启TensorBoard的问题及方法步骤
解决在win系统下使用DOS命令开启TensorBoard的问题及方法步骤: TensorBoard是TensorFlow下的一个可视化的工具,能够帮助研究者们可视化训练大规模神经网络过程中出现的复杂 ...
- 模糊搜索:concat各种函数详解、like操作符、通配符
if(StringUtils.isNotBlank(queryBean.getConditions())){ hqlBuilder.addWhereClause(" concat(this. ...
- .NET-DataColumn.DataType 属性
public DataTable MakeDataTable(){ DataTable myTable; DataRow myNewRow; // Create a new DataTable. my ...
- 【转】go语言的字节序
原文:http://lihaoquan.me/2016/11/5/golang-byteorder.html 这个人的博客写的不错,品质也比较高. 我应该也要有这种精神,这种态度.深入到计算机的世界中 ...
- python从数据库获取全量数据的方法
python从数据库获取全量数据的方法 学习了:https://blog.csdn.net/lom9357bye/article/details/79503658 原文膜拜: import psyco ...
- 扩展Jquery方法创建LigerUI Grid
///** //*封装jquery get请求ajax //*author:叶明龙 //*time:2012-12-10 //*/ function getAjax(url, para, fn) { ...
- 【甘道夫】Win7环境下Eclipse连接Hadoop2.2.0
准备: 确保hadoop2.2.0集群正常执行 1.eclipse中建立javaproject,导入hadoop2.2.0相关jar包 2.在src根文件夹下拷入log4j.properties,通过 ...
- 内网渗透技巧:判断机器真实外网IP的5种方法总结
在内网渗透中有时需要在某台WEB服务器中留下后门,该机器可以通过内网IP建立IPC连接,但还需要获知外网IP或域名才能访问Wbshell,在无网关权限的情况下,我总结了有如下方法: 1.通过nsloo ...
- python 字典的KeyError处理方法
先看一段代码: user = dict(name="brainliao", age=32) print(user["sex"]) 运行结果如下: user这个字 ...
- Unity3d 录像
flashtd1: 回复 tqfa :我觉得是有方法可以实现的,之前使用高通的增强显示开发包时发现其实它是添加了一个类似movietexture的东西,叠加在它的摄像机上 如果文档里有操作moviet ...