Как повторно использовать активы в нескольких сценах - PullRequest
Новая
       18

Как повторно использовать активы в нескольких сценах

0 голосов
/ 04 октября 2019

Я хочу повторно использовать активы в нескольких сценах, но я получаю эту ошибку: 

Texture key already in use

Вот соответствующий код. Обратите внимание, что я хочу использовать одну и ту же таблицу спрайтов в обеих сценах. Как мне сделать это без получения этой ошибки? 

class InventoryScene extends Phaser.Scene {
    constructor() {
        super({ key: 'InventoryScene', active: true });
    }
    preload() {
        this.load.spritesheet('sheet1', 'assets/sheet1.png', 
            { frameWidth: 16, frameHeight: 16 });
    }
    create() {
        this.add.sprite(this.game.canvas.width * .50, 
                this.game.canvas.height * .50, 'sheet1')
            .setFrame(0)
            .setInteractive()
            .on('pointerdown', () => this.zoomIn())
            .setScale(6);
    }
}
class GameScene extends Phaser.Scene {
    constructor() {
        super({ key: 'GameScene', active: true });
    }
    preload() {
        this.load.spritesheet('sheet1', 'assets/sheet1.png', 
            { frameWidth: 16, frameHeight: 16 });
    }
    create() {
        this.add.sprite(this.game.canvas.width * .50, this
                .game.canvas.height * .50, 'sheet1')
            .setFrame(0)
            .setVisible(false);
    }
}

Вот мой игровой конфигурационный файл: 

var config = {
    ...
    // Order here matters.  The first scene is listed last.
    scene: [DebugScene, InventoryScene, GameScene, HowToPlayScene, TitleScene]
};

Затем я использую this.scene.bringToTop('HowToPlayScene') для активации сцены.

PS: я использую Phaser 3

1 Ответ

1 голос
/ 16 октября 2019

Я создал для вас модифицированный пример с Phaser v3.17.

Копировать Вставьте приведенный ниже код и замените существующий на странице. Нажмите кнопку «Выполнить код» в верхней части экрана и, возможно, придется подождать 5-10 секунд: https://labs.phaser.io/edit.html?src=src/scenes/changing%20scene.js

Сцены будут изменены, если щелкнуть первую сцену, а другие в цикле. Обратите внимание на спрайт-лист "face" и "balls", который был загружен только в первой сцене и this.scene.start ('sceneB'); 

var SceneA = new Phaser.Class({

    Extends: Phaser.Scene,

    initialize:

    function SceneA() {
        Phaser.Scene.call(this, { key: 'sceneA' });
    },

    preload: function () {
        this.load.image('face', 'assets/pics/bw-face.png');
        this.load.spritesheet('balls', 'assets/sprites/balls.png', { frameWidth: 17, frameHeight: 17 });
    },

    create: function () {
        this.add.sprite(400, 300, 'face').setAlpha(0.2);
        this.add.sprite(400, 300, 'balls', 3);
        this.input.once('pointerdown', function () {

            console.log('From SceneA to SceneB');

            this.scene.start('sceneB');

        }, this);
    }

});

var SceneB = new Phaser.Class({

    Extends: Phaser.Scene,

    initialize:

    function SceneB() {
        Phaser.Scene.call(this, { key: 'sceneB' });
    },

    preload: function () {
        this.load.image('arrow', 'assets/sprites/longarrow.png');
    },

    create: function () {

        this.add.sprite(400, 300, 'face').setAlpha(1);
        this.arrow = this.add.sprite(400, 300, 'arrow').setOrigin(0, 0.5);
        this.add.sprite(400, 300, 'balls', 3);
        this.input.once('pointerdown', function (event) {

            console.log('From SceneB to SceneC');

            this.scene.start('sceneC');

        }, this);
    },

    update: function (time, delta) {
        this.arrow.rotation += 0.01;
    }

});

var SceneC = new Phaser.Class({

    Extends: Phaser.Scene,

    initialize:

    function SceneC() {
        Phaser.Scene.call(this, { key: 'sceneC' });
    },

    preload: function () {
        this.load.image('mech', 'assets/pics/titan-mech.png');
    },

    create: function () {
        this.add.sprite(Phaser.Math.Between(0, 800), 300, 'mech');
        this.add.sprite(400, 300, 'balls', 3);
        this.input.once('pointerdown', function (event) {

            console.log('From SceneC to SceneA');

            this.scene.start('sceneA');

        }, this);
    }

});

var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    backgroundColor: '#000000',
    parent: 'phaser-example',
    scene: [SceneA, SceneB, SceneC]
};

var game = new Phaser.Game(config);
...