转盘抽奖游戏在一般的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 转盘抽奖游戏(原生)的更多相关文章

  1. js实现大转盘抽奖游戏实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jquery实现转盘抽奖

    jquery实现转盘抽奖 一.总结 一句话总结:这里环形转盘,环形的东西可以化成线性的,然后访问到哪个,给他加上背景为红的样式,用定时器开控制转盘的速度,函数执行的时间间隔越小,就运动的越快. 1.如 ...

  3. 原生JS实现简易转盘抽奖

    我爱撸码,撸码使我感到快乐. 大家好,我是Counter. 本章带大家来简单的了解下原生JS实现转盘抽奖. 因为主要涉及到JS,在这里HTML和CSS起到的功能就没有那么重要, 因此,没有过多的阐述H ...

  4. C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断

    C#保留2位小数几种场景总结   场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...

  5. 原生js轮盘抽奖实例分析(幸运大转盘抽奖)

    效果图: 所需图片素材: 这张图是pointer.png的位置的. turntable-bg.jpg这张是转盘背景图,在背景位置. 这张是turntable.png位置的. 需要这三张图片,如果要实现 ...

  6. web:转盘抽奖

    移动web:转盘抽奖(幸运大转盘)   为了获取客户.回馈客户,平台一般会推出抽奖活动类的营销页.因此web页面中,有各式各样的抽奖效果. 格子式(九宫格),背景滚动式(数字/文字/图案),旋转式(转 ...

  7. 移动web:转盘抽奖(幸运大转盘)

    为了获取客户.回馈客户,平台一般会推出抽奖活动类的营销页.因此web页面中,有各式各样的抽奖效果. 格子式(九宫格),背景滚动式(数字/文字/图案),旋转式(转盘),游戏式(砸蛋/拼图...).... ...

  8. 利用C# 窗体设计 写一个抽奖游戏

    老师布置了一个任务,要求我们做一个抽奖游戏,以下是我个人制作的一个作品与写项目的过程. 我们用到了8个pictureBox控件和一个button,设置好大小,并且编排成一个九宫个形状 添加窗体的背景图 ...

  9. 【Vue.js游戏机实战】- Vue.js实现大转盘抽奖总结

    大家好!先上图看看本次案例的整体效果. 实现思路: Vue component实现大转盘组件,可以嵌套到任意要使用的页面. css3 transform控制大转盘抽奖过程的动画效果. 抽奖组件内使用钩 ...

随机推荐

  1. Android-Universal-Image-Loader载入图片

    直接看代码:MainActivity: package com.example.textwsjdemo; import com.nostra13.universalimageloader.cache. ...

  2. Docker创建centos的LNMP镜像

    前段时间重装了系统,今天刚好有时间,就用docker安装一个lnmp开发环境,下面是我的安装笔记. 1. 安装docker 这个就不说了,不会的可以看下我之前的文章<Docker介绍及安装> ...

  3. Apache2.4 与 php7.1.6的链接

    首先Apache已经安装成功,在浏览器中能够打开再下载php 我的Apache安装版本为Apache2.4.26 x64 vc14 所以我php也应该是vc14编译的 php下载地址为 http:// ...

  4. [NM 状态机2] Container状态机详解

    概述 前面已经分析了RM的状态机,接下来将分析NM的状态机,NM状态机包括Container,Application,LocalizedResource三个,其中Container相对较复杂.现在我们 ...

  5. Win7如何关闭 打开文件-安全警告

    如图所示,运行一个EXE程序就会弹出提示,很麻烦.   在运行对话框中输入gpedit.msc打开组策略编辑器.定位到用户配置--管理模板--windows组件--附件管理器 点中等危险文件类型抱含列 ...

  6. POJ 1041 John&#39;s trip Euler欧拉回路判定和求回路

    就是欧拉判定,判定之后就能够使用DFS求欧拉回路了.图论内容. 这里使用邻接矩阵会快非常多速度. 这类题目都是十分困难的.光是定义的记录的数组变量就会是一大堆. #include <cstdio ...

  7. Reading assignments in science

    First, get a perspective: Review the assignment in the syllabus and any handouts (1-2 minutes)Maybe ...

  8. Android 文件存储 和 权限管理

    转载请标明出处: :http://blog.csdn.net/huaiyiheyuan/article/details/52473984 android SD卡主要有两种存储方式 Internal . ...

  9. iOS-UICollectionView快速构造/拖拽重排/轮播实现

    代码地址如下:http://www.demodashi.com/demo/11366.html 目录 UICollectionView的定义 UICollectionView快速构建GridView网 ...

  10. 获取SQL Server的安装时间

    近期安装SQL Server 2014时.还没有正式的License,仅仅能试用3个月.想知道什么时候到期,就要知道SQL Server 2014是什么时候安装的.假设你没有特意记录安装日期(实际大部 ...