如何修复在CreateJS中画布上未显示预加载资源的问题？

Question

我想通过将背景设置为画布来创建动画，然后尝试在背景图像上移动我的资源。我能够在画布中显示背景图像，并且能够预加载所有资源。然而，我无法在画布上显示任何资源。

我尝试调整位图的坐标，以防它显示在可见区域之外。我还尝试检查更新舞台的时间是否有问题，但没有成功。希望能得到帮助。

function set()
{
    var cgroup = new createjs.Container();

    cgroup.x = 100;
    cgroup.y = 100;


    // var path = 'img/cloud1.png';
    var img = preload.getResult("c1");
    console.log(img.src);  //displaying correct preloaded file
    var cloud1 = new createjs.Bitmap(img);
    cgroup.addChild(cloud1);
    cloud1.x = 120;
    cloud1.y = 120;
    cloud1.regX = 62;
    cloud1.regY = 62;

    stage.addChild(cgroup);
    stage.update();
}

- Steve Tom

---

console.log(img.src); //显示正确的预加载文件，并不意味着文件已经加载完成。 - Jaromanda X

文件已在资源和网络面板中显示为已加载。谢谢。 - Steve Tom

所以，你的意思是说，通过查看资源和网络面板，你可以确切地知道文件实际上是在这个点 console.log(img.src);（甚至不到1毫秒）被加载的？因为 console.log(img.src); 并不表示文件已经被加载。 - Jaromanda X

那么问题就出在这里了——你到底怎么预加载呢？这就是你需要“修复”事情的地方。 - Jaromanda X

让我们在聊天中继续这个讨论。 - Steve Tom

Answer 1

你需要调用函数才能使其运行。例如，这可以在页面加载时进行。

window.onload() = function(){
  var cgroup = new createjs.Container();

  cgroup.x = 100;
  cgroup.y = 100;

  // var path = 'img/cloud1.png';
  var img = preload.getResult("c1");
  console.log(img.src); //displaying correct preloaded file
  var cloud1 = new createjs.Bitmap(img);
  cgroup.addChild(cloud1);
  cloud1.x = 120;
  cloud1.y = 120;
  cloud1.regX = 62;
  cloud1.regY = 62;

  stage.addChild(cgroup);
  stage.update();
};

- Yoko Ishioka

---

该函数在预载入函数后也从我的初始化函数中被调用。谢谢。 - Steve Tom

抱歉，只是确认一下。你是否在另一个函数中创建了舞台？这是我看到的唯一缺失的部分。祝你好运！ - Yoko Ishioka

是的，正确的，在我的初始化函数中，该函数又调用了设置函数。 - Steve Tom

Answer 2

原来我正在使用 context，背景图像是使用 drawImage 显示的，当我将另一张图片添加到舞台上时，画布只显示第二张图片，因此清除了第一张图片。

- Steve Tom