Animated Dialogue Text - Problem With Line Break

Question

Hello!

I am making a game with animated dialogue and I run into a problem when one word is being written in one line and then when it takes too much space it jumps down to the next line. I demonstrated that in this video (I slowed down text writing so it's obvious what is happening). You can see the word "possible" being written in one line, and then finished down on next line.

https://www.youtube.com/watch?v=ZCu4M2OFGRw&feature=youtu.be

Does anyone have any idea how we could predict that word is going to be too long for that line, and then start writing it in next line right away? I had idea of testing how long the next word is going to be, by checking how many characters there are until the next Space in string. But even if I do this, I don't know how to test if that word is going to be too long to fit in current line or will it be pushed into the next line.

Here is simplified version of function that I run in Update() to animate text:

 if (currentlyAnimatedText.Length > 0)
                 {
                     char letter = char.Parse(currentlyAnimatedText.Substring(0, 1));
 
                     currentlyUsedDialogueBox.text += letter;
                     currentlyAnimatedText = currentlyAnimatedText.Remove(0, 1);
                 }

Any ideas? Thanks!

Answer 1

Best Answer

Answer by EntertainmentForge · Oct 13, 2017 at 11:09 AM

I ended up solving this by instead of writing char by char, I wrote whole dialogue text but then changed color of the text to alpha 0. And then instead of adding char's I just moved this tag "") thought the text, making it look like it's writing text, even thought whole text is already there.

Here is the simplified code:

     string currentlyAnimatedText = "";//assign dialogue text here
         string tempAnimatedText = "";
         int currentlyAnimatedIndex;
     
     void Update()
         {
                         if (currentlyAnimatedIndex < currentlyAnimatedText.Length)
                         {
                             currentlyAnimatedIndex++;

                              currentlyUsedDialogueBox.text = currentlyAnimatedText;
                              tempAnimatedText = currentlyUsedDialogueBox.text.Insert(currentlyAnimatedIndex, "<color=#00000000>");
                         currentlyUsedDialogueBox.text = tempAnimatedText;
                         }
                     
                 
         }

Add comment · Show 2 · Share

ghostmode · Oct 13, 2017 at 11:35 AM 0

Share

Creative solution!

eyeballTickler · Aug 29, 2018 at 10:47 PM 0

Share

Thank you for this! Very clever solution.

For anyone else confused by the formatting, this tag "") is referring to the color tag with a color of #00000000 (black with an alpha of zero) used with TextMeshPro.

Answer 2

Answer by ghostmode · Oct 13, 2017 at 06:41 AM

You'll need to figure out how best to incorporate this into your dialog system, but as a start you can determine the width required to display a string as follows:

 var text = GetComponent<Text>();
 var textGenerator = text.cachedTextGenerator;
 var textSettings = text.GetGenerationSettings(Vector2.zero);
 
 string dialog = "Hello, world!";
 float width = textGenerator.GetPreferredWidth(dialog, textSettings);
 Debug.Log("width needed: " + width);

Add comment · Show 3 · Share

EntertainmentForge · Oct 13, 2017 at 11:03 AM 1

Share

I didn't manage to figure out how to use this to fix the problem. But thanks for helping anyway!

ghostmode EntertainmentForge · Oct 13, 2017 at 11:32 AM 1

Share

Fair enough. Your code for the animated text is short and sweet, but to add this feature it needs to get a bit more complicated unfortunately. The right answer to this may be "You can, but it's probably not worth the effort", but I'll provide some more details.

In order to know when to move to a new line, you'll need to keep track of:

max line width
current line width
word width

You'll need to check if each word fits before you start writing it.

Check if the 'current line width' + 'word width' > 'max line width'. If it is then write a "\n" and set 'current line width' = 0, then write the word.

When you write a word, update 'current line width' += 'word width'.

EntertainmentForge ghostmode · Oct 13, 2017 at 12:02 PM 0

Share

Yeah your're right. It's possible but very tricky. Plus I am using text mesh pro for text and I think I don't have cachedTextGenerator and GetGenerationSettings features. Unless I missed something.

Animated Dialogue Text - Problem With Line Break

2 Replies

Your answer

Welcome to Unity Answers

Follow this Question

Related Questions