Phaser 3 抛出“Texture.frame missing:”警告并且无法加载帧，我该如何解决？ [复制]答案

【问题标题】：phaser 3 throws "Texture.frame missing:" warning and fails to load frame, how do I fix it? [duplicate]Phaser 3 抛出“Texture.frame missing:”警告并且无法加载帧，我该如何解决？ [复制]
【发布时间】：2022-01-16 11:56:41
【问题描述】：

注意：我的代码已经在运行并渲染精灵

一键到play with

我在学习a phaser3 loader example

这是我写的代码

class BootScene extends Phaser.Scene {
  constructor() {
    super();
  }
  preload() {
    this.load.path = 'https://raw.githubusercontent.com/liyi93319/phaser3_rpg/main/part1/assets/';
    this.load.atlas('player', 'knight_atlas.png', 'knight_atlas.json');
  }
  create() {
    var player = this.add.sprite(80, 100, 'player', 0);
    player.setScale(.5);
  }
}

var config = {
  width: 400,
  height: 300,
  pixelArt: true,
  physics: {
    default: 'arcade',
    arcade: {
      gravity: { y: 0 },
    }
  },
  backgroundColor: 0x000000,
  scene: [BootScene]
}

var game = new Phaser.Game(config);

&lt;script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"&gt;&lt;/script&gt;

到目前为止一切正常。

但是，如下更改create()

  create() {
    var player = this.add.sprite(80, 100, 'player', 5);
    player.setScale(.5);
  }

未按预期加载框架并引发警告

Texture.frame 缺失：5

我将“knight_atlas.json”文件与官方示例中的the one 进行了比较。我看不出有什么区别。

我也查了doc，但没有找到解决办法。

我错过了什么？

【问题讨论】：

这能回答你的问题吗？ Error loading files from Multiatlas in Phaser3
@code 在我看来，错误的问题是另一个问题，因为错误的路径不必做任何事情，使用索引而不是图集的键/文件名。
@yaojp 错误与路径无关，您必须使用来自atlas 的密钥/文件名。

标签： javascript phaser-framework

【解决方案1】：

如果您想使用第三个参数，则必须使用字符串（或纹理对象），在这种情况下，来自 atlas 的 filename 应该可以工作。这里是relevant documentation

class BootScene extends Phaser.Scene {
  constructor() {
    super();
  }
  preload() {
    this.load.path = 'https://raw.githubusercontent.com/liyi93319/phaser3_rpg/main/part1/assets/';
    this.load.atlas('player', 'knight_atlas.png', 'knight_atlas.json');
  }
  create() {
    var player = this.add.sprite(80, 100, 'player', 'Attack (3).png');
    player.setScale(.5);
    
    var player2 = this.add.sprite(240, 100, 'player', 'Idle10');
    player2.setScale(.5);
  }
}

var config = {
  width: 400,
  height: 300,
  pixelArt: true,
  physics: {
    default: 'arcade',
    arcade: {
      gravity: { y: 0 },
    }
  },
  backgroundColor: 0x000000,
  scene: [BootScene]
}

var game = new Phaser.Game(config);

&lt;script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"&gt;&lt;/script&gt;

【讨论】：