Repository navigation
Material and Shader Properties
Material Float and Material Color steps animate a value on an element's shader: a fullscreen transition's _Progress, a glow's strength, a dissolve amount, a tint.
- On the Image, RawImage or TextMeshPro text, Add Component → UI Material Instance.
- Add a
Material FloatorMaterial Colorstep, and point it at that object (leave the slot empty if it's the player's own). - Type the property's name into Shader Property, exactly as the shader names it (e.g.
_Progress, with the underscore).
UI Material Instance gives the element its own copy of the material when the game starts. That way the animation can never change the material asset in your project, or every other element that shares it.
If the name is blank or doesn't exist on that shader, the step shows a ⚠ naming the shader and property, and is skipped in the game.
See Examples: Fullscreen shader transition for a complete recipe.
Warning
A stencil Mask above the element stops the animation from showing. Use a RectMask2D instead, or untick Maskable on the Image. The component warns you if it spots this. Fullscreen overlays usually aren't inside a mask, so the common case is fine.
Note
TextMeshPro works, but animates TMP's own material instance. TMP ignores the usual material slot, so the component uses the text's fontMaterial instead.
Under the hood
- The shader property is looked up once with
Shader.PropertyToID. - Material steps can only target a UI Material Instance, so there's no Inspector slot that could point an animation at a shared material asset by accident.
-
The Mask problem: UGUI takes a one-time cached copy of the material for stencil masking (
StencilMaterial.Add) and never re-syncs it, so animated values never reach the screen.MaterialPropertyBlockdoesn't work with UGUI at all, so there's no way around it inside a stencil mask. -
TextMeshPro ignores
Graphic.materialentirely. The component usesTMP_Text.fontMaterial, and never destroys it, since TMP owns it. - If you write editor code around this, don't read
UIMaterialInstance.Materialfrom it: the first read creates the instance and assigns it to the Graphic, which changes the scene. Read the Graphic's own material instead.
Installation
Code API
Basic usage
Advanced usage
- Punch and Shake
- Sizing a RectTransform
- Movement Paths
- Sound
- Custom Property
- Material and Shader Properties
- Stylised Motion
- Interrupting and Chaining
- Mirroring
- Copy and Paste
- Animation Sets
- Scene Gizmos
Nitty-gritties
Warnings and Troubleshooting