PIXI V5 PIXI.Loader()无法添加到图像容器

时间:2019-12-11 14:21:40

标签: pixi.js

我使用PIXI V5,但无法添加到图像容器中...

const app = new PIXI.Application({
  view: document.getElementById('main'),
});

const container = new PIXI.Container();
app.stage.addChild(container);


const loader = new PIXI.Loader();
loader
  .add('imgtest','https://fakeimg.pl/100/')
  .load((loader, resources) => {
    const sprite = new PIXI.Sprite(loader.resources.imgtest.texture);
    container.addChild(sprite);
  });

我尝试console.log(loader.resources.imgtest.texture)不确定...

2 个答案:

答案 0 :(得分:0)

最初渲染舞台时,加载的纹理将不可用,因此添加: const renderer = PIXI.autoDetectRenderer();,并在加载图像后调用renderer.render(container);

通过使用new PIXI.Sprite(resources.imgtest.texture)的方式,省略loader.

此外,我不确定生成的没有.png或jpg扩展名的图像是否可以通过pixi工作。

答案 1 :(得分:0)

Pixi v5使用的API与以前的版本不同,它们在应用程序类中已经具有一个加载程序,您可以使用PIXI.Loader.shared访问该加载程序。您可以将其分配给变量,但是我只在应用程序中使用以下内容:

PIXI.Loader.shared
    .add('myImage', 'assets/myImage.png')
    .load((loader, resources) => {
        const sprite = new PIXI.Sprite(resources.myImage.texture);
        container.addChild(sprite);
 });

使用这种语法,您可以将图像映射到作为第一个参数给出的ID。