Javascript 相位器-将遮罩应用于包含精灵的组

我在学习phaser的同时，正在尝试创建一个基本的老虎机，到目前为止，我已经想出了加载四行三个精灵，然后向上滚动它们。理想情况下，只有三行可见（总共9个精灵），第四行只是缓冲区，所以当我将顶部移动到底部时，顶部不会奇怪地消失

我所有的精灵都被添加到一个组中，目的是掩盖组的顶部和底部

以下是我目前的代码（简称）：

this.comboBase

是基本精灵，老虎机的背景

var comboMask = this.game.add.graphics(this.comboBase.x, this.comboBase.y);
comboMask.beginFill(0xffffff);
comboMask.drawRect(this.comboBase.x, this.comboBase.y + 170, this.comboBase.width, 85);
console.log(comboMask.width);

for (var i = 0; i < 4; i++) {
  var ranNum = Math.floor((Math.random() * 3) + 1);
  var arrowRight;
  var arrowDown;
  var arrowLeft;
  if (ranNum == 1) {
    arrowRight = this.game.add.sprite(this.comboBase.x - 85, arrowY, 'ui');
    arrowDown = this.game.add.sprite(this.comboBase.x, arrowY, 'ui');
    arrowLeft = this.game.add.sprite(this.comboBase.x + 85, arrowY, 'ui');        
    this.comboRouletteList1.push(arrowRight);
    this.comboRouletteList2.push(arrowDown);
    this.comboRouletteList3.push(arrowLeft);
  }
  else if (ranNum == 2) {
    // Different arrangement     
    this.comboRouletteList1.push(arrowDown);
    this.comboRouletteList2.push(arrowLeft);
    this.comboRouletteList3.push(arrowRight);
  }
  else if (ranNum == 3) {
    //Different arrangement     
    this.comboRouletteList1.push(arrowLeft);
    this.comboRouletteList2.push(arrowRight);
    this.comboRouletteList3.push(arrowDown);
  }

  arrowY += 85;
  arrowRight.anchor.set(0.5, 0.5);
  arrowDown.anchor.set(0.5, 0.5);
  arrowLeft.anchor.set(0.5, 0.5);
  arrowRight.frameName = 'ui_specialR.png';
  arrowDown.frameName = 'ui_specialD.png';
  arrowLeft.frameName = 'ui_specialL.png';
  this.comboRouletteGroup.add(arrowRight);
  this.comboRouletteGroup.add(arrowDown);
  this.comboRouletteGroup.add(arrowLeft);
}    

this.comboRouletteGroup.add(this.comboTop);
this.comboRouletteGroup.mask = comboMask;

---

有什么建议吗？

Afaik，稍后添加的精灵将覆盖早期精灵，因此您只需添加12槽精灵，然后添加遮罩精灵，然后根据需要更改12槽精灵的位置和图像。Afaik，稍后添加的精灵将覆盖早期精灵，因此您只需添加12槽精灵，然后是遮罩精灵，然后根据需要简单地更改12插槽精灵的位置和图像。

var comboMask = this.game.add.graphics(this.comboBase.x, this.comboBase.y + this.comboBase.height);
comboMask.beginFill(0xffffff);
comboMask.drawRect(comboMask.x, comboMask.y, this.comboBase.width, 100);