Animated Sprite with custom shader (material)

In some of our games we use custom material chunks on sprites, image and text elements and it work fine but with animated sprites it look like we’re limited to a single custom material.

From the source code

Since animated sprite fetch the default material on every frame change, the only way to have a custom material on then seems to be to overwrite the sprite component default material. (defaultMaterial / default9SlicedMaterialSlicedMode / default9SlicedMaterialTiledMode). This is fine with one custom material, but if we want to have, different animated sprites use different materials it will not work as each need to change the default one used by all animated sprite.

Ideally, we should be able to set the material for a single animated sprite like we can for images, text and normal sprite:

this.entity.element.material = ...
this.entity.sprite.material = ...

Calling @mvaligursky in case he has a workaround for this.

I think there is a feature request for being able to set a custom material on text elements in the engine repo.

@jpaulo spent some time looking on the materials of elements … he might know more?
But I agree this needs to be exposed using some API, that is definitely missing.

1 Like

Only thing I can think of short term is to monkey patch the function and change this check: engine/component.js at 6564b03857e1e7079e6d46070e61283136ecce1a · playcanvas/engine · GitHub

So that it doesn’t change the mesh instance material if it’s not the default sprite one.

That way, you can assign your custom material to the mesh instance without it being overridden every sprite frame.

1 Like

Added ticket as a feature request: Add API to assign material to a sprite · Issue #4303 · playcanvas/engine · GitHub