关于 Phaser 3 中的自定义类答案

【问题标题】：About custom classes in phaser 3关于 Phaser 3 中的自定义类
【发布时间】：2020-09-01 14:51:45
【问题描述】：

互联网用户呢？我是论坛的新手，我有一个非常小的 javascript 之旅，也许我的问题是，当我进入 javascript 时，一位朋友正在教我 React。

抱歉我的英语不好，我会说西班牙语。

我想很多人已经谈到了这个话题，但我希望你澄清我的疑问，如果你能或不能，从 Phaser 开始，我或多或少有一个星期我做了很多练习，一切都很好，但是当我决定自己创建一个平台项目时，他们在 Phaser 但在 es6 和 typescript 中有示例另一个按钮，我只是重用生成按钮的组件。

到目前为止一切顺利，我的问题是以下我想创建一个“播放器”类，如果我或多或少没记错的话，这是要实现的代码。

class Character extends Phaser.GameObjects.Sprite {
    constructor(config) {
        super(config.scene, config.x, config.y, "character");
        //keep a reference to the scene
        this.scene=config.scene;
        config.scene.add.existing(this);

我想知道我是否可以在该代码中放置图像加载（预加载）以及相同的运动机制（更新），因为我什至理解的是，对于每个场景，您似乎都必须重新加载图片，正如我所说，我的想法是重用创建类的代码，我不知道这是否是正确的想法，但我一直在尝试，但我没有取得任何成果，我已经查看了示例，我只看到他们创建单独上课，没有在外面加载图像和机制，他们把所有东西都放在一个文件中，这很乏味，我重复尝试实施反应哲学，为了不浪费太多时间，我问他们是否可以实现这样的事情。

理论上我想实现这样的目标，“WARNINGi”只是我知道代码错误的假设。非常感谢您抽出宝贵时间，希望您能澄清我的疑问，希望您一切都好。 :)

class Character extends Phaser.GameObjects.Sprite {
    constructor(config) {
        super(config.scene, config.x, config.y, "character");
        //keep a reference to the scene
        this.scene=config.scene;
        config.scene.add.existing(this);
    }

        // load images
    preload ()
    {
        this.load.image('character', 'assets/sprites/character.png');
    }
    update ()
    {
        // player movement mechanics
    }
}
export default Character;

【问题讨论】：

实际上每个场景都不会重新加载图像，您只需在使用播放器的第一个场景中加载纹理。任何后续加载纹理（精灵或图像）的调用实际上都不会重新加载它。 Phaser 看到密钥正在使用中并且没有覆盖（重新加载图像）。
您可以尝试在类中加载它（请参阅 Phaser.Loader.LoaderPlugin），但我认为这不值得。只需在第一个场景的预加载中加载它，图像将在需要时可供所有其他场景（和类）使用。

标签： javascript ecmascript-6 phaser-framework

【解决方案1】：

根据游戏的复杂程度，通常您可以在游戏加载之前预加载所有资源。如果您的游戏只有一个场景，您可以在该场景的preload 中添加加载资源的功能，否则如果您的游戏包含多个场景（如启动画面、主菜单、主游戏、游戏画面、 ...）您可能想要创建一个场景来预加载您的资源（通常这由带有进度条的加载屏幕表示）。

不管怎样，你肯定不想在你的精灵中预加载资源，在你的场景中做。

class Preloader extends Phaser.Scene {
    preload() {
        // Sets a default path, making your code a little smaller if you default to using an assets directory.
        this.load.path = "assets/";
        this.load.image("character", "sprites/character.png");
        // ...
    }
}

一旦您预加载资产，它们就可以使用，直到您关闭游戏，或以编程方式移除资产。

这意味着您可以将super(config.scene, config.x, config.y, "character"); 保留在您的Character 构造函数中，并完全删除preload()。

【讨论】：