Jump to content
Search Community

PIXI.js change sprite texture

POSIX test
Moderator Tag

Recommended Posts

Hi and welcome to the GreenSock forums.

 

Texture is a property of the Sprite display object and can be changed manually using code, I've done that in the past without any issues. There are a couple of things you need to keep in mind though, first the texture's base texture has to be ready by the time the sprite is updated (using the base texture's instance loaded method), and second I'm not sure it can be done in the regular GSAP fashion, meaning that is not something you want or need to update on every GSAP tick. Perhaps use an event callback like onStart or just a regular function to update the texture.

 

Finally make sure that the base texture and hence the texture itself do exist before updating the sprite, since the error stems from this:

 

http://pixijs.download/release/docs/packages_sprite_src_Sprite.js.html#line201

 

More specifically line 215.

 

Perhaps @OSUblake can shed some light into this, since He is the PIXI master of this realms :D 

 

Happy Tweening!!!

  • Like 5
Link to comment
Share on other sites

On 3/8/2020 at 11:47 AM, Rodrigo said:

Perhaps @OSUblake can shed some light into this, since He is the PIXI master of this realms :D 

 

Nah, you covered it pretty well. GSAP can really only animate number values and string values with number or color values in it. A texture is a complex object. If you need to change the texture, then you need to do it inside a callback.

  • Like 4
Link to comment
Share on other sites

  • 2 years later...

Yes, it is very much possible to swap a pixi sprite's texture with gsap.

I was able to swap the texture of a sprite with a canvas this way:

 

const dataUrl = canvas.toDataURL('png');

const base = new PIXI.BaseTexture(dataUrl);

const newTexture = new PIXI.Texture(base);

gsap.set(resource, {
pixi: { texture: newTexture}
});

 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...