无法在Phaser中显示简单图像
无法在Phaser中显示简单图像
提问于 2022-10-05 00:00:58
所以我想用Phaser来做一个我想做的项目。我在他们的网站上学习教程，但后来我碰上了一堵光秃秃的墙。在我写的一句话里，它说：
function create() {
this.add.image(400, 300, 'sky');
}我读了这篇文章，它应该显示一张天空的图片(我事先将它导入到我的项目中)，但它仍然是一个空白的屏幕。
到目前为止，我尝试了很多事情，但仍然不起作用。有人能帮忙吗？
下面是所有相关的配置：
var config = {
type: Phaser.AUTO,
width: 800,
height: 600,
scene: {
preload: preload,
create: create,
update: update,
},
};和法典：
var game = new Phaser.Game(config);
//Loads in sprites
function preload() {
this.load.image('sky', 'assets/sky.png');
this.load.image('ground', 'assets/platform.png');
this.load.image('star', 'assets/star.png');
this.load.image('bomb', 'assets/bomb.png');
this.load.spritesheet('dude', 'assets/dude.png', {
frameWidth: 32,
frameHeight: 48,
});
}
//Displays sprites
function create() {
this.add.image(400, 300, 'sky');
}
//Update loop
function update() {}回答 1
Stack Overflow用户
发布于 2022-10-05 14:19:47
检查资产的urls，在代码中使用项目文件夹结构 on playcode.io。尝试在播放代码上运行代码，它似乎有效：
(至少在发布网站时是这样的。我不得不假设，网络预览会冻结/崩溃，这是https://codeplay.io/与phaser框架一起发布的问题)
编辑器：
结果：
更新preview) (如果需要
由于playcode.io上的预览似乎使用临时文件，并且Urls与真正的文件结构不完全匹配，所以您可以使用这个解决方法来解决这个问题。
只是：
- 对于任何要加载位相的图像，只需在html中加载图像。
示例：
<img id="sky" src="assets/sky.png" style="width:1px;height:1px;" /> - 在相位器中，
preload函数将所有this.load.image替换为this.textures.addImage这里是一个链接到文档
这里有一个例子：
替换代码行：
this.load.image('sky', 'assets/sky.png');有了这个：
this.textures.addImage('sky', document.getElementById('sky')); 由于似乎是，所以播放代码预览无法处理从javascript生成的图像-urls，您可以使用这个解决方法。，但仅用于在播放代码上进行开发，用于生产，或在发布时使用原始
this.load.image(...)。这种解决办法也适用于生产，但并不是最优的，也不推荐。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73954722
复制相关文章
相似问题
腾讯云开发者
