Speech Bubble Animations & Positioning

[Mackerel_Sky]

Hi,

I'm looking to implement speech bubbles for barks as one of the finishing touches on the conversation systems that I've been building with Dialogue System.

I looked through some old threads and there seems to be a lot of interest on dynamic tails, etc.

I'm just looking to try to set the position of the speech bubble relative to the speaker depending on the length of the sentence and the direction the speaker is facing.



The white box in the picture above is the Rect Transform of the bubble. I change its local Position to always have it in front of the speaker's face and change the panel image to one with a left or right tail depending on the direction. However, while this works for short sentences longer ones extend the panel out beyond the transform's position and past the speaker's face as evident in the picture.

I've tried fiddling around with the pivot and anchor points, the text entry position (the left/middle/right lines) but haven't had any luck. Do you have any idea if/how I can fix this?

Also, is there a way to play the text like a standard DS type writer effect?

[Tony Li]

Hi,

I have two different suggestions:

Suggestion 1: Examine the anchors of the UI elements. If you move the tail to the right, you'll probably want to change the anchors to the lower right. If you move the tail to the left, change the anchors to the lower left. You can still add a typewriter effect. Tick its Play On Enable checkbox. In the next update, StandardBarkUI will check if the UI has a typewriter effect and automatically start it without you having to tick Play On Enable.

Suggestion 2: Or use the Lively Chat Bubbles integration. It handles dynamic tails and dynamic sizing, and it has its own typewriter effect. It's an extra expense ($14 USD as of this reply) but if it's in your budget then you might want to consider it since it pretty much gets rid of the headache of managing bubble UIs.

[Mackerel_Sky]

Hey Tony,

I decided to play around with the anchor points a bit more and figured it out.

Due to needing to flip some colliders, etc. when my characters turn around, I have them face different directions by modifying their localScale.x, which modifies any children that their game objects may hold (like the bark UI in this case). As a result, I found that setting the pivot point to (0, 0) for a dialogue box's main prefab ensured it would be already flipped correctly when the character turned around.

The main problem lay in making sure the bubble expanded horizontally in the correct direction when displaying different sentence lengths. I solved this by changing the panel's pivot point to (1,0) (bottom right) when the character was facing left, and (0,0) (bottom left) when the character was facing right. This ensured that the tail of the speech bubble was correctly positioned. I also reset its rectTransform to (0,0) when the characters turned to ensure that the text was positioned correctly.

Hopefully this might help somebody else who has the same issues.

Now I don't think I would ever have any barks long enough to warrant a second line, but just in case does the Bark UI support a maximum horizontal length and start expanding vertically? It's not a big deal, just more as a curious question.

[Tony Li]

Now I don't think I would ever have any barks long enough to warrant a second line, but just in case does the Bark UI support a maximum horizontal length and start expanding vertically? It's not a big deal, just more as a curious question.

Yes. It depends on which UI you're using. If you're looking at the Standard Bubble Bark UI, it's bounded by the width of the Main Panel container. The Dialogue System doesn't do anything special there; it just relies on Unity UI's layout functionality.