1

我正在尝试更改 createjs 中的位图图像,并希望在单击重置按钮时删除容器中的所有子项。但是 removeAllChildren 在我身上不起作用。

function drawPhoneImage() {
  stage = new createjs.Stage('canvas');
  container = new createjs.Container();

  phone = new createjs.Bitmap(phoneImg);
  phone.x = 268;
  phone.y = 64;

  stage.addChild(container);
  container.addChild(phone);
  stage.update();

  phone.addEventListener("click", function() {
    console.log('phone clicked');
    createjs.Ticker.addEventListener("tick", movePhoneImage);
  });
}

function movePhoneImage(event) {
  phone.x -=10;

  if(phone.x <  156) { 
    phone.x =156;
    showPhoneSnap();
  }
  stage.update(event);
}

然后单击电话对象后,我需要用另一个位图替换它(有效):

function showPhoneSnap() {
  snap = new createjs.Bitmap(snapImg);
  snap.x = 156;
  snap.y = 64;

  container.removeAllChildren();
  container.addChild(snap);
  stage.update();
}

起初,removeAllChildren 在容器的第一个孩子中工作,但是当我在容器中添加另一个位图后尝试重置舞台时..removeAllChildren() 不起作用。

function resetStage() {
  container.removeAllChildren();
  stage.update();
} 

我很难解决这个问题,感谢任何可以提供帮助的人。

4

1 回答 1

0

确保“snapImg”是已加载的图像。

snap = new createjs.Bitmap(snapImg);

问题是加载图像时您没有更新阶段。

var image = new Image();
image.src = "path";
image.onload = showPhoneSnap;
function showPhoneSnap() {
    //This will ensure that the image is ready.
    var bmp = new createjs.Bitmap(this);
    ...
    stage.update();
}
于 2014-01-20T23:45:39.377 回答