Skip to main content

TrailEffectTMP Component

Overview

This component adds a visual trail effect to the TextMeshPro text component it is applied to.

WebGL Demo

Properties

Component Screenshot

Property                            TypeDetails
Trail
    LayersIntThe number of layers the trail has. More layers is more expensive. Default value is 16, range is [0..64].
    Damping FrontFloatThe rate at which the front of the trail catches up with the movement. Higher value results in a less laggy trail. Default value is 50, range is [0..250].
    Damping BackFloatThe rate at which the back of the trail catches up with the movement. Higher value results in a less laggy trail. Default value is 50, range is [0..250].
    Alpha CurveCurveOptional curve to control transparency. Transparency can also be controlled by the gradient property, but having this secondary control is useful when the gradient is animated but you still want to apply a static transparency falloff.
    Vertex ModifierEnumWhich vertex modifiers are used to calculate the trail motion. Options are:
Transforms - Only use transform modifications (translation, rotation, scale), this is the simplest. (DEFAULT)
Vertices - Only use vertex modifications.
TransformsAndVertices - Use both of the above, this is the most expensive.
Gradient
    GradientGradientThe gradient colors used by the trail
    OffsetFloatThe offset applied to the gradient. The gradient will wrap using mirrored repeating.
    ScaleFloatThe scaling applied to the gradient. The gradient will wrap using mirrored repeating.
Animation
    Offset SpeedFloatThe animation speed for the offset property of the gradient. Allows easy simple scrolling animation without scripting. Set to zero for no animation.
Apply
    Show Trail OnlyBoolOnly show the trail, hide the original UI Graphic
    Blend ModeEnumWhich color blending mode to use to mix the original vertex colors with the gradient colors. Options are:
Source - Only use the original color, this ignores any trail gradient/alpha settings.
Replace - Ignore the original color and replace with the trail gradient/alpha settings.
Replace_Multiply - Same as Replace for RGB, but multiply the original alpha with the trail gradient alpha.
Multiply - Multiply the original color with the trail gradient/alpha settings. (DEFAULT)
Add_Multiply - Add the original color RGB to the gradient gradient, but multiply the alpha value.
    Trail Strength ModeEnumThe mode to use for fading out the trail when strength < 1.0. Options are:
Damping - Reduce damping so that when strength == 0.0 there is no lag in the trail.
Layers - Remove each layer, starting from the back so that when strength == 0 there are no layers visible.
FadeLayers - Same as Layers but with fading instead of a hard cut. (DEFAULT)
Fade - Fade the entire trail down at the same time.
    StrengthFloatStrength of the effect. Default value is 1.0, range is [0..1]

Setup

To use this component with TextMeshPro you first need to have the support for TextMeshPro enabled:

  1. Make sure TextMeshPro package is added to your project
  2. Go to the Edit > Project Preferences window and open the UIFX options, enabled TextMeshPro Support and press the Apply Changes button.

    screenshot
  3. Wait for the scripts to reload
  4. Close the Preferences window

Usage

Add this component to any GameObject that contains a UI TMP_Text component. The text will now render with a trail that follows it as it moves.