Check that PIXI.Texture is ready

[charlie_says]

Apologies this question feels a little basic:

I'm creating a Texture from data, which works fine - but there's a delay in the texture being ready. I've worked around this for now by using a timeout, Is there a way to use Promises to capture this (I've looked at some examples but it wasn't clear how.)

Thanks,

Charlie

[themoonrat]

https://pixijs.download/dev/docs/packages_core_src_textures_Texture.ts.html#line266

Texture objects emit an 'update' event

So you can do

texture.on('update', () => { console.log(texture.valid) });

Edited December 2, 2020 by themoonrat

[ivan.popelyshev]

Actually, that's not enough.

Either you use promise form: https://www.pixiplayground.com/#/edit/dx4cOOhJ82M9b9P4thJ6o

Quote

const promise = PIXI.Texture.fromURL("https://i.imgur.com/jXMsFla.png");

promise.then((resolvedTexture) => {
    // or you can create sprite here based on resolvedTexture
    app.renderer.render(sprite, renderTexture);
})

 

either you use old one:

const doStuff = () = > {
    console.log('loaded');
}

if (texture.valid) {
    doStuff();
} else {
    texture.on('update', doStuff);
}

Internally, both are the same. If you open Sprite sources , onTextureUpdate method - that's exactly what will you see there.

Even if you are loading this texture first time, it can be ready just after from() method because it can be in browser cache

Edited December 2, 2020 by ivan.popelyshev

[charlie_says]

Thanks @ivan.popelyshev I'd actually gone with this

	this._texture.on('update', () => { if (this._texture.valid) { this.contOpen()} });

which I think is more or less the same as yours. The only thing to note is that with mine this.contOpen() gets called twice.

I'm going to try your Promise example in the morning.

[ivan.popelyshev]

wont work if texture is already valid

[charlie_says]

ahhh - good point, thanks

[charlie_says]

<edited> Promise works fine!...

Edited December 3, 2020 by charlie_says