水果机抽奖(CocosCreator)
推荐阅读:
一。前言
在前面给大家分享了大转盘的抽奖方式,这是现在游戏使用较多的一种抽奖方式,今天给大家介绍另一抽奖方式——水果机,这是以前街机游戏使用较多的抽奖方式。该方式使用选中奖品的方式来进行抽奖。
二。算法讲解
先声明几个变量来控制选项依次选中的转动效果,可在properties里面声明,以方便调试时修改数值:
//最大速度
maxSpeed: {
default: 20,
type: cc.Float,
max: 30,
min: 1,
},
//减速时间==加速时间
duration: {
default: 2,
type: cc.Float,
max: 10,
min: 1,
},
//加速度
acc: {
default: 8,
type: cc.Float,
max: 10,
min: 1,
},
gearNum: {
default: 10,
type: cc.Integer,
max: 10,
min: 1,
},
不需要经常修改的变量,声明在onLoad中:
this.wheelState = 0; //转盘状态 1--加速 2--减速 0--静止
this.curSpeed = 0; //当前速度
this.spinTime = 0; //减速前旋转时间
this.firstAngle = 30; //每个奖品的中间角度
this.gearAngle = 60; //每个奖品的角度
this.finalAngle = 0; //最终结果指定的角度
this.decAngle = 3 * 360;//减速旋转三周
抽奖转动状态设置为3个阶段,0(未转动),1(加速阶段),2(减速状态)。在加速状态时,通过判断转动速度是否达到最大速度来判断下一阶段是继续加速还是开始减速。在减速阶段,通过判断减速阶段需要转动的角度是否等于减速阶段已经转过的角度,从而判断转动是否结束。
三。功能实现
1.加速阶段
if (self.wheelState == 1)
{
self.spinTime += dt;//加速阶段的时间累计
self.uiRoot.startAward.rotation += self.curSpeed;//每帧后旋转的角度
this.showIndexLight(self.uiRoot.startAward.rotation);//显示指针到达区域的奖品的外发光
if (self.curSpeed <= self.maxSpeed) {
self.curSpeed += self.acc;//修改下一帧速度
} else {
if (self.spinTime < self.duration) {//判断时间是否到
return;
}
//设置目标值
self.finalAngle = self.targetID * self.gearAngle + self.firstAngle;//指针最后停留的位置
self.maxSpeed = self.curSpeed;//当前速度未转动过程中的最大速度
self.wheelState = 2;
}
}
2.减速阶段
else if (self.wheelState == 2)
{
var curRo = self.uiRoot.startAward.rotation;
var hadRo = curRo - self.finalAngle;//减速阶段已经转过的角度
self.curSpeed = self.maxSpeed * ((self.decAngle - hadRo) / self.decAngle) + 0.2;//后面加一个数是使指针最后能停下来
self.uiRoot.startAward.rotation += self.curSpeed;
this.showIndexLight(self.uiRoot.startAward.rotation);
if ((self.decAngle - hadRo) <= 0) {//判断是否转完
self.wheelState = 0;
self.uiRoot.startAward.rotation = self.finalAngle;
this.showIndexLight(self.uiRoot.startAward.rotation);
//大转盘结束后的一些列操作,根据实际情况需要增加删除
self.ctrolWheelItem(true);
self.uiRoot.close.active = true;
self.uiRoot.startBtn.active = true;
self.uiRoot.close.active = true;
self.uiRoot.sign.interactable = true;
self.uiRoot.wheel.interactable = true;
for (let i = 0; i < self.uiRoot.wheelBg.childrenCount; i++) {
cc.find("item" + i, self.uiRoot.wheelBg).getComponent(cc.Button).interactable = true;
}
var data = cls.WheelLayer._srvData.SC_Wheel_Info;
let info = gm.GameData.getBagDataById(data.award[this.targetID].id);
self.showRewardBox(data.award[this.targetID].id, info.Icon, data.award[this.targetID].num);
console.log("抽奖操作结束,需要同步奖励奖励数据,暂时不知道同步到哪里去");
}
同步指针指到的奖品区域外发光
//显示指针到达的区域发光
showIndexLight(rot) {
var index = parseInt(rot / 60) % 6;/60代表每个奖品格子的角度,6代表一共6个格式
for (let i = 0; i < this.wheelLight.length; i++) {
this.wheelLight[i].active = false;
}
this.wheelLight[index].active = true;
},
水果机抽奖(CocosCreator)的更多相关文章
- 【Vue.js游戏机实战】- Vue.js实现九宫格水果机抽奖游戏总结
大家好!先上图看看本次案例的整体效果. 完整版实战课程附源码:[Vue.js游戏机实战]- Vue.js实现九宫格水果机抽奖 实现思路: Vue component实现九宫格水果机组件,可以嵌套到任意 ...
- 【Vue.js游戏机实战】- Vue.js实现老虎-机抽奖总结
大家好!先上图看看本次案例的整体效果. 完整版实战课程附源码:[Vue.js游戏机实战]- Vue.js实现老虎-机抽奖 实现思路: Vue component实现老虎-机组件,可以嵌套到任意要使用的 ...
- 《微赢微信公众平台系统5月14最新破解高级运营版+水果机+邀请函+微汽车+微食品+用户CRM》
<微赢微信公众平台系统5月14最新破解高级运营版+水果机+邀请函+微汽车+微食品+用户CRM> 此版本号眼下是淘宝卖600RMB的,其他VIP源代码论坛也都还没有公布.咱们这里全然免费分享 ...
- 手把手教你用JS/Vue/React实现幸运水果机(80后情怀之作)
项目体验地址 免费视频教程 分别使用原生JS,Vue和React,手把手教你开发一个H5小游戏,快速上手Vue和React框架的使用. 项目截图 在线体验 在线体验 游戏介绍 幸运水果机是一款街机游戏 ...
- 从零开始手把手教你使用原生JS+CSS3实现幸运水果机游戏
项目体验地址 免费视频教程 游戏介绍 幸运水果机是一款街机游戏,游戏界面由24个方格拼接成一个正方形,每个方格中都有一个不同的水果图形,方格下都有一个小灯.玩家使用游戏币选择希望押注的目标,按下开始后 ...
- 抽奖动画 - lao虎机抽奖
本文介绍一个lao虎机抽奖动画的实现,lao虎机抽奖在各类商家营销活动中非常常见,这里主要介绍动画的实现过程,其他细节不做详细分析. ps:lao虎机是敏感词,博客园不允许出现,所有老用拼音. 1. ...
- 原生javascript实现老.虎机抽奖点名demo源码思路解析
想着使用原生Javascript做一个随机点名的小应用, 也可以做抽奖使用. html简单化,人名单可以通过js生成并处理. 可以非常随意的添加修改人名字. 应用想带点特效,比如老.虎机转动的特效. ...
- H5水果机,一个网络版的lao hu ji
该游戏为h5小游戏,纯属娱乐,技术探讨,相关技术在文章结尾,欢迎探讨交流 花了几天时间开发了这款水果lao hu ji,更新了几个版本,还有不足的地方,由于时间有限暂时没有继续更新新版本 未完成的功能 ...
- cocos 水果机,老Tiger虎机流水灯,博彩大转盘效果
原(http://www.cnblogs.com/zisou/p/cocos2d-xZhuanpan.html) 博彩大转盘,转盘抽奖的小系统,这是一个很有意思的游戏模块,游戏中增加这样一些趣味的小模 ...
随机推荐
- Docker部署web环境之Lanmp
1. 案例一 整套项目多容器分离通过docker-compose部署lanmp环境 中方文档参考网址: docker/kubernets网址 http://www.dockerinfo.net/doc ...
- python注释-输入输出-基本数据类型-运算符
python注释 用处:注释用来书写一些解释性信息,对代码的逻辑作用等作出描述 单行注释.多行注释 # 这是行注释,注释内容与# 之间要空一格 print("hello world!&quo ...
- 【MySQL】(六)锁
开发多用户.数据库驱动的应用时,最大的一个难点是:一方面要最大程度地利用数据库的并发访问,另一方面还要确保每个用户能以一致的方式读取和修改数据.为此就有了锁(locking)的机制,同时这也是数据库系 ...
- Java基础之方法
方法 某段代码经常使用,可以使用大括号将这段代码包括起来,起个名字,以后就使用这个名字来代替这段代码. 定义格式: 修饰符 返回值类型 方法名(参数列表) { 方法体语句: return语句: } ...
- Java基础之分支结构循环结构
流程控制语句if(分支结构) 流程控制:流程就是指代码运行过程.控制就是说什么场景可以执行,什么场景不能执行. 1.if语句第一种形式 格式:if(表达式){ 执行的语句: } 2. ...
- Redis项目实战---应用及理论(二)---Redis集群原理
一. Redis官方推荐集群方案:Redis Cluster 适用于redis3.0以后版本, redis cluster 是redis官方提供的分布式解决方案,在3.0版本后推出的,有 ...
- springcloud-provider-consumer-register
作者:纯洁的微笑出处:http://www.ityouknow.com/ 版权归作者所有,转载请注明出处 上一篇文章我们介绍了eureka服务注册中心的搭建,这篇文章介绍一下如何使用eureka服务注 ...
- DotSpatial安装、类库引用方法
解决VS工具栏添加DotSpatial后,控件不全问题. 注意注意注意:不要使用Nuget安装DotSpatial!!! 我在Nuget上把所有DotSpatial的版本都安装了一遍,都缺少控件,然后 ...
- 使用vsftp与shell实现对进程与服务状态的监控
先说一下需求吧,公司开发了一款新的产品,新产品嘛,有着不得不出问题的理由,四个云机房,总共三百余台机器,需要实时的监控进程状态,虽然有zabbix来实现,但领导需求是脚本和zabbix一起做,zabb ...
- 带你剖析WebGis的世界奥秘----瓦片式加载地图
WebGIS应用程序的页面能够通过HTML.JSP.ASP或任何任何类型的Web页文件构成,其特殊之处在于,它的请求提交的方法并不是通过常用的 "超链接"形式,而是使用鼠标与Web ...