Avoid visual movement of word when showing sentence dynamicaly

Question

On cocos creator, I want to show the dialog, in a way like Typed.js. Basically showing the letters as if someone is typing them.

The problem is that I have a Label of a determined width, and, when there is a word near the end of the size of the Label, it starts writing on a line, and finishes writing on another line.

I would like that word to start writing it at the start of the next line, but I don't know how to do it.

The thing that I have tried:

1. RichText for Cocos creator, to make the part of the sentence that stills needs to be written transparent, but RichText on cocos creator cannot be transparent.

2. Try to write the word before rendering it, and then check the size of the Label, to see if the dimension has changed, so I will have to set the last word on a new line, but the Label size is not updated until rendered, and I want it before rendering.

Any idea on how to accomplish this?

Answer 1

found a solution, and it's to first put all the words on the scene, without showing them, and then calculate the size of every word, then, calculate at witch word the sentence would break, and add a line break before that word. I don't know if it's the most optimized approach, but it works and I don't know any other way to do it.