水果机抽奖(CocosCreator)

简介: 水果机抽奖(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;
    },
相关文章
|
7月前
|
JavaScript
jQuery幸运大转盘抽奖活动代码
jQuery幸运大转盘抽奖活动代码
90 7
jQuery幸运大转盘抽奖活动代码
|
7月前
|
移动开发 JavaScript 前端开发
分享46个JS抽奖转盘,总有一款适合您
分享46个JS抽奖转盘,总有一款适合您
176 1
|
7月前
|
存储 JavaScript 前端开发
JS实现简单的九宫格抽奖攻略
JS实现简单的九宫格抽奖攻略
91 0
|
4月前
|
开发工具 开发者
如何用 CocosCreator 对接抖音小游戏的侧边栏复访
最近小游戏的软著下来了,用 CocosCreator 做的游戏也完成了 1.0 版本。而当我打包成抖音小游戏进行提交时,还没到初审就给拒了,因为还有一个机审,机器检测到代码中没有接入 “侧边栏复访功能”。这个我还真不知道,那只能去官方看文档了,位置是小游戏开发文档 -> 指南 -> 开放能力 -> 侧边栏能力。
45 2
|
5月前
|
UED
Flutter仿Boss-2.启动页、引导页
Flutter仿Boss-2.启动页、引导页
74 0
|
5月前
|
缓存
Flutter仿Boss-6.底部tab切换
Flutter仿Boss-6.底部tab切换
42 0
|
7月前
|
小程序
大转盘抽奖小程序源码
大转盘抽奖小程序源码,测试依旧可用,无BUG,跑马灯旋转效果,非常酷炫。
107 1
|
7月前
|
小程序
html+css+js实现带有转盘的抽奖小程序
html+css+js实现带有转盘的抽奖小程序
125 0
|
7月前
|
前端开发 JavaScript 容器
html+css+js写抽奖程序
html+css+js写抽奖程序
124 0
|
7月前
|
Go
Qt实现一个抽奖游戏
Qt实现一个抽奖游戏