CocosCreator 轉盤效果

遊戲大轉盤邏輯，經過代碼控制轉盤的 加速、高速、減速三個狀態，方便調整效果。
若是是unity能夠採用animtion來調整動畫節奏。cocosCreator暫時還沒找到對應的ApI
如下是代碼邏輯：

// Learn TypeScript:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/typescript.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/reference/attributes.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/life-cycle-callbacks.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/life-cycle-callbacks.html

const { ccclass, property } = cc._decorator;

@ccclass
export default class UITurnplateAnimation {

    isPlay: boolean = false

    /**顯示旋轉結果回調 */
    private OnEndCallBack: Function

    /**加速轉圈數
    finalAngle: number = 0

    /** 轉動狀態 1:加速  2:減速  **/
    wheelState: number = 0

    /** 當前速度 **/
    curSpeed: number = 2

    /**當前旋轉值 **/
    curRotation: number = 0

    /**最大旋轉速度 **/
    maxSpeed: number = 30

    /**加速度 **/
    acc = 1

    /**減速轉券數 **/
    decAngle: number = 1 * 360

    /**加速轉券數 **/
    accAngle: number = 1 * 360

    /**是否回彈 **/
    springback: boolean = false

    /**最近一格的角度 **/
    private gearAngle = 360 / 6

    /** 最終旋轉角度 */
    private finalAngle: number

    /**目標旋轉對象**/
    private targetNode: cc.Node

    private maxSpeedRun: boolean = true


    StartRun(rotationNode: cc.Node, finalAngle: number, cellNum: number, endCallBack) {
        this.isPlay = true
        this.targetNode = rotationNode

        this.gearAngle = 360 / cellNum
        this.OnEndCallBack = endCallBack

        this.finalAngle = finalAngle + this.accAngle

        if (this.springback) {
            this.finalAngle += this.gearAngle;
        }
        this.maxSpeed = 30
        this.wheelState = 1
        this.curSpeed = 2
        this.curRotation = this.curRotation % 360
        this.targetNode.rotation = this.curRotation
        this.maxSpeedRun = true
    }

    update(dt) {
        if (this.isPlay) {
            if (this.wheelState == 1) {
                this.curRotation = this.targetNode.rotation + this.curSpeed;
                this.targetNode.rotation = this.curRotation
                if (this.curSpeed <= this.maxSpeed) {
                    this.curSpeed += this.acc;
                }
                else {
                    if (this.maxSpeedRun) {
                        //console.log(".....最大速度旋轉2圈")
                        this.finalAngle += 360 * 1
                        this.maxSpeedRun = false
                    }

                    if (this.curRotation <= this.finalAngle) {
                        return;
                    }
                    // cc.log('....開始減速');
                    //設置目標角度
                    this.maxSpeed = this.curSpeed;
                    this.targetNode.rotation = this.finalAngle;
                    this.wheelState = 2;
                }
            }
            else if (this.wheelState == 2) {
                // cc.log('......減速');
                var curRo = this.targetNode.rotation; //應該等於finalAngle
                var hadRo = curRo - this.finalAngle;
                this.curSpeed = this.maxSpeed * ((this.decAngle - hadRo) / this.decAngle) + 0.2;
                this.targetNode.rotation = curRo + this.curSpeed;

                if ((this.decAngle - hadRo) <= 0) {
                    //cc.log('....中止');
                    this.wheelState = 0;
                    this.targetNode.rotation = this.finalAngle;
                    if (this.springback) {
                        //倒轉一個齒輪
                        var act = cc.rotateBy(0.5, -this.gearAngle);
                        var seq = cc.sequence(cc.delayTime(0.1), act, cc.callFunc(() => {
                            if (this.OnEndCallBack != null) {
                                this.OnEndCallBack();
                                this.OnEndCallBack = null
                            }
                        }, this));
                        this.targetNode.runAction(seq);
                    }
                    else {
                        if (this.OnEndCallBack != null) {
                            this.OnEndCallBack();
                            this.OnEndCallBack = null
                        }
                    }
                }
            }
        }
    }
}


//使用方式：
//this.turnplateAnimation.StartRun(this.img_pointer, rotation, 6, end)
//this.update(dt) 須要在管理中每幀啓動調用