this.button.eOnClick(() => {
this._displayInterval = 0.1;
const items = this.drawArea.children;
let currentIndex = 0;
let rounds = 0;
const showIcon = () => {
if (rounds >= 2 && currentIndex - 1 === this.prizeIndex) {
this.info('333');
return; // 终止递归
}
if (currentIndex >= items.length) {
currentIndex = 0;
rounds++;
}
const currentItem = items[currentIndex];
const iconNode = currentItem.getChildByName('icon');
items.forEach((item) => {
const icon = item.getChildByName('icon');
if (icon) {
icon.active = false; // 隐藏所有 "icon"
}
});
this._displayInterval += 0.01;
if (iconNode) {
iconNode.active = true; // 显示 "icon"
this.scheduleOnce(() => {
iconNode.active = false; // 隐藏 "icon"
currentIndex++;
showIcon();
}, this._displayInterval);
} else {
currentIndex++;
showIcon();
}
};
showIcon();
})
prizeIndex: number = 0; // 中奖的奖项索引,可以根据需求调整
private _displayInterval: number = 0.1; // 切换 "icon" 显示状态的时间间隔
// 抽奖区
@property(cc.Node)
protected drawArea: cc.Node = null;
// 抽奖按钮
@property(cc.Node)
protected button: cc.Node = null;
在引擎上,创建一个九宫格,每个格子里面,添加一个icon,控制这个icon,循环的显示与关闭,就能够达到九宫格抽奖的效果。
如果想要速度由块到慢,就逐步添加_displayInterval 的值,如果想保持就不添加,如果想由慢到块,就逐步减少它的值。