Fade out old dialogue

[boz]

Is there a built in function to maybe lower the transparency on previous text?

For example, in the WRPG template, the text stays and you can scroll through it - so what if every time you clicked "continue", it greyed out the previous text so only the new text was fully in focus?

If not built in, any tips on where to begin doing that?

[Tony Li]

Hi,

It's not built in, but you can write a small subclass of StandardUISubtitlePanel such as:

GrayPreviousTextSubtitlePanel.cs

Code: Select all

using PixelCrushers.DialogueSystem;
public class GrayPreviousTextSubtitlePanel : StandardUISubtitlePanel
{
    protected const string grayOpenTag = "<color=#c0c0c0>";
    protected const string grayCloseTag = "</color>";

    public override void SetContent(Subtitle subtitle)
    {
        // Wrap previous text in rich text tags that shows it grayed out:
        if (!accumulatedText.Contains(grayCloseTag))
        {
            // No previous rich text codes, so add them:
            accumulatedText = grayOpenTag + accumulatedText + grayCloseTag;
        }
        else
        {
            // Text already has rich text tags, so move the closing tag to the end of the text:
            var closePos = accumulatedText.LastIndexOf(grayCloseTag);
            accumulatedText = accumulatedText.Remove(closePos, grayCloseTag.Length) + grayCloseTag;
        }
        base.SetContent(subtitle); // This also adds the new text to the end of accumulatedText.
    }
}

Here's an example scene:

DS_GrayPreviousText_2020-10-28.unitypackage

[boz]

It seems all my other em tags are messing with the colors.

This might be a more extensive feature than I bargained for, I might have to come back for this one later.

[Tony Li]

No, it's easy to address.

If you want it to change the entire previous text to gray, even bits text that had their own color, change the script to:

Code: Select all

using UnityEngine;
using PixelCrushers.DialogueSystem;
using System.Text.RegularExpressions;

public class GrayPreviousTextSubtitlePanel : StandardUISubtitlePanel
{
    protected const string grayOpenTag = "<color=#c0c0c0>";
    protected const string grayCloseTag = "</color>";

    public override void SetContent(Subtitle subtitle)
    {
        // Remove all color tags from previous text and then wrap in gray color:
        const string pattern = @"<color=\w+>|<color=[#][\w|\d]+>|</color>";
        Debug.Log(accumulatedText + " ==> " + Regex.Replace(accumulatedText, pattern, string.Empty));
        accumulatedText = grayOpenTag + Regex.Replace(accumulatedText, pattern, string.Empty) + grayCloseTag;
        base.SetContent(subtitle);
    }
}

(The script's actually a little shorter this way.)

If you need to retain the color in the bits that have their own color, you can modify the script to use UITools.WrapTextInColor(), which properly wraps <color> tags around text while still being aware of other <color> tags.

[boz]

This looks really promising, thank you!

I'll admit I'm sort of a noob when it comes to editing strings with code, so this is an eye-opening experience.

[Tony Li]

Glad to help!

[Tony Li]

Note: This post has a script that fades out old dialogue and trims older lines from the panel.