/** @format */ const {ccclass, property} = cc._decorator export enum ROLL_STATE { ready = 1, rolling, stop, } @ccclass export default class Roll extends cc.Component { curIndexArr: number[] = [1, 1, 1, 1] rightIndexArr: number[] = [1, 2, 3, 4] items1: cc.Node items2: cc.Node state: ROLL_STATE curRollIndex: number = 0 upFinish: boolean = false downFinish: boolean = false spinTimes: number = 3 singleRollTime: number = 0.3 inversionTime: number = 0.1 stopTime: number = 0.4 initRoll() { this.state = ROLL_STATE.ready this.items1 = cc.find('items1', this.node) this.items2 = cc.find('items2', this.node) this.items1.stopAllActions() this.items2.stopAllActions() this.items1.y = 0 this.items2.y = this.items1.height this.randomIndex(4, this.items1) this.randomIndex(4, this.items2) } startRoll() { this.state = ROLL_STATE.rolling this.curRollIndex = this.spinTimes this.aniRoll() } aniDownRoll(node) { cc.tween(node) .to(this.curRollIndex > 1 ? this.singleRollTime : this.stopTime, {y: -this.items1.height}) .call(() => { this.downFinish = true this.endRoll() }) .start() } aniUpRoll(node) { cc.tween(node) .to(this.curRollIndex > 1 ? this.singleRollTime : this.stopTime, {y: 0}) .call(() => { this.upFinish = true this.endRoll() }) .start() } aniRoll() { this.upFinish = false this.downFinish = false let upRoll = this.items1.y < this.items2.y ? this.items2 : this.items1 let downRoll = this.items1.y < this.items2.y ? this.items1 : this.items2 this.aniUpRoll(upRoll) this.aniDownRoll(downRoll) } endRoll() { if (this.upFinish && this.downFinish) { let upRoll = this.items1.y < this.items2.y ? this.items2 : this.items1 let downRoll = this.items1.y < this.items2.y ? this.items1 : this.items2 if (this.curRollIndex > 0) { if (this.curRollIndex > 1) { this.randomIndex(4, downRoll) } else if (this.curRollIndex == 1) { this.curIndexArr = this.rightIndexArr this.initItemIcon(downRoll) } downRoll.y = this.items1.height this.curRollIndex -= 1 this.aniRoll() } else if (this.curRollIndex == 0) { cc.tween(upRoll) .to(this.inversionTime, {y: -5}) .to(this.inversionTime, {y: 0}) .call(() => { this.state = ROLL_STATE.stop }) .start() } } } randomIndex(randomNum, node) { let tmp = Math.randomRangeIntArr(1, 13, randomNum) if (randomNum < 4) { for (let i = this.curIndexArr.length - 1; i >= 0; i--) { if (i >= randomNum) { this.curIndexArr[i] = this.curIndexArr[i - 1] } else { this.curIndexArr[i] = tmp[i] } } } else { this.curIndexArr = tmp } this.initItemIcon(node) } initItemIcon(node) { for (let i = 0; i < node.children.length; i++) { let item = node.children[i] } } }