How to fade TextMesh alpha with LeanTween?

9.2k views Asked by At

I was looking for a way to fade the alpha value of TextMesh-Text in Unity, but I could not finde a solution online nor in the LeanTween Documentation.

  • LeanTween.alphaText() does only work with the normal UI-Text (not TextMesh)
  • LeanTween.alpha() doesn't do anything for me on Text.
5

There are 5 answers

0
derHugo On BEST ANSWER

After looking briefly through the API I guess a better way than introducing CanvasGroups just for fading one single text would rather be using LeanTwean.value for setting its color. CanvasGroup is a bit overkill here in my opinion.

(example adopted from API)

TextMeshProUGUI text;

void Start()
{
    text = GetComponent<TextMeshProUGUI>();
    var color = text.color;
    var fadeoutcolor = color;
    fadeoutcolor.a = 0;
    LeanTween.value(gameObject, updateValueExampleCallback, fadeoutcolor, color, 1f).setEase(LeanTweenType.easeOutElastic).setDelay(2f);
}


void updateValueExampleCallback(Color val)
{
    text.color = val;
}
0
Vivien Lynn On

I came up with my own solution.

Instead of changing the alpha of the TextMesh-Component directly, I add a CanvasGroup to the Gameobject that holds my TextMesh-Component. Then I manipulate the alpha value of the CanvasGroup instead.

To use my example code:

  1. On your Canvas go: [RightClick] > UI > Text - TextMeshPro
  2. Attach my example Script to this Gameobject. (This creates the required CanvasGroup automatically)
  3. Press Play (Ctrl + P)

After a delay of 2 Seconds (because of.setDelay(2f) the Text should fade in.

Examplecode:

using UnityEngine;
using TMPro;

[RequireComponent(typeof(CanvasGroup))]
public class LeanTweenTextFade : MonoBehaviour
{          
    private void Start()
    {
        CanvasGroup canvasgroup = this.gameObject.GetComponent<CanvasGroup>();
        TextMeshProUGUI infoTextTMPro = this.gameObject.GetComponent<TextMeshProUGUI>();

        canvasgroup.alpha = 0f;
        infoTextTMPro.text = "This Text should fade in.";

        float duration = 1f;
        LeanTween.alphaCanvas(canvasgroup, 1.0f, duration).setDelay(2f);
    }
}
2
Jeffrey ジェフリー On

You can also extend the LeanTween extension methods file (LeanTweenExt.cs) with the follow lines. This method will allow you to apply the LeanAlphaText on textMeshes like you're used to do on UI Texts.

public static LTDescr LeanAlphaText (this TextMesh textMesh, float to, float time) {
    var _color = textMesh.color;
    var _tween = LeanTween
        .value (textMesh.gameObject, _color.a, to, time)
        .setOnUpdate ((float _value) => {
            _color.a = _value;
            textMesh.color = _color;
        });
    return _tween;
}
0
Charlie Baker On

Simple solution building on other ideas from this thread.

This solves our issue by extending LeanTween's functionality, allowing the chaining of operations (which is a must for LT) and setting up a system to be easily reusable as opposed to building a dedicated function for each TMP game object you want to target.

Paste into LeanTween.cs (carefully, there are multiple class definitions within the file):

public static LTDescr LeanTMPAlpha(TextMeshProUGUI txt, float to, float time)
{
    var color = txt.color;
    var fadeoutcolor = new Color(color.r,color.g,color.b,to);
    return LeanTween.value(txt.gameObject, color, fadeoutcolor, time).setOnUpdate(co => txt.color = co);
}

public static LTDescr LeanTMPColor(TextMeshProUGUI txt, Color to, float time)
{
    var color = txt.color;
    var fadeoutcolor = to;
    return LeanTween.value(txt.gameObject, color, fadeoutcolor, time).setOnUpdate(co => txt.color = co);
}

Paste into LeanTweenExt.cs:

public static LTDescr LeanTMPAlpha(this TextMeshProUGUI txt, float to, float time) { return LeanTween.LeanTMPAlpha(txt, to, time); }

public static LTDescr LeanTMPColor(this TextMeshProUGUI txt, Color to, float time) { return LeanTween.LeanTMPColor(txt, to, time); }

Example demonstrates calling function from extension class helper function (tmp.LeanTMPAlpha(...)) and chaining with standard LeanTween call (LeanTween.LeanTMPAlpha(tmp,....):

void Start() 
{
    TextMeshProUGUI tmp = GetComponent<TextMeshProUGUI>();
    tmp.LeanTweenAlpha(0f, 2f).setOnComplete(() => LeanTween.LeanTMPAlpha(tmp, 1f, 4f).setEaseOutExpo()); 
}
0
mehdi shamsi On

Try this as simplified one:

using TMPro;
[SerializeField] private GameObject Ready_Text;

void Start()
{
LeanTween.value(Ready_Text, 0, 1, 1).setOnUpdate(UpdateTextAlpha);
}
private void UpdateTextAlpha(float alpha)
{
        Color color = Ready_Text.GetComponent<TextMeshProUGUI>().color;
        color.a = alpha;
        Ready_Text.GetComponent<TextMeshProUGUI>().color = color;
}