Content in dialogue/conversation not appearing right.

danieleinseth · Post by **danieleinseth** » Mon Feb 16, 2015 5:24 am

Hi,

I need some help displaying the content of the conversations in my game. At the moment i have the actual dialogue (subtitles) with a background that's semi transparent. I have a continue button also with a background that's semi transparent, an image of the actor giving the line, and the actors name.

I have mainly two problems. The first one is that the continue button is diplayed underneath the "text box", so it's bearly visible. The other issue that I have is the each object seam to have a given area where they are visible, and for instance scaling the image of the actor talking automatically crops that image to the area they are given. How do I increase this area?

Tony Li · Post by **Tony Li** » Mon Feb 16, 2015 7:50 am

Hi Daniel,

What GUI system are you using?

If you're using legacy Unity GUI, look at the Scaled Rects for sizes and positions, and at the portrait image's GUILabel settings for the actor's image.

If you're using the new Unity UI, look at the Rect Transforms. All scaling, sizing, and positioning is done using standard Unity UI methods.

Please feel free to send an example project to tony (at) pixelcrushers.com. I'll be happy to take a look. Exporting the scene and its dependencies as a unitypackage works best.

Otherwise, could you post a screenshot that shows what's going on and what you'd like to work differently?

danieleinseth · Post by **danieleinseth** » Tue Feb 17, 2015 3:12 pm

I am using legacy Unity GUI, but that's what I've been doing. I am able to scale the imagage itself, but not the box that crops the image. what about the continue button?

I could post a screenshot, but I can't find any button to do this on this page.

Tony Li · Post by **Tony Li** » Tue Feb 17, 2015 3:40 pm

Sorry, this isn't the greatest forum software. I plan to move to phpBB soon. In the meantime, try the attachment feature that I just enabled. (I'm attaching an image as a test.) If that doesn't work, try the image BBcode: [ img]url-to-image[ /img]

I don't quite follow about the continue button position. Hopefully a screenshot or two will clarify your issues.

danieleinseth · Post by **danieleinseth** » Wed Feb 18, 2015 12:13 am

as you can see in the screenshot, one version over another to show the portrait image, it also show the continue button, but just bearly. (the text color is pure black)

danieleinseth · Post by **danieleinseth** » Wed Feb 18, 2015 1:11 am

Here is my settings so you can see.

Tony Li · Post by **Tony Li** » Wed Feb 18, 2015 6:34 am

Hi,

I'm out of the office right now, but I'll send a reply as soon as I can. The continue button will be an easy fix. Do you want the image to look like the top or bottom one? (Just want to make sure I have it clear.)

Tony Li · Post by **Tony Li** » Wed Feb 18, 2015 1:43 pm

Hi Daniel,

For the continue button:

When the Dialogue System draws Unity GUI elements, it draws the parent first and then children. Let's say you have this set of GameObjects in your hierarchy:

GUI Root

Dialogue Panel

Continue Button

NPC Subtitle Line

The Dialogue System will draw GUI Root first, then Dialogue Panel (e.g., a background image) on top of GUI Root, then the children Continue Button and NPC Subtitle Line on top of Dialogue Panel. It will draw the children in an unspecified order unless you tick Dialogue Panel's Depth Sort Children checkbox and set the Depth values to specify an order.

If you want to draw the continue button on top of the text box, make the continue button a child of the text box. Or, if they're siblings, use Depth Sort Children.

For the portrait image:

When the Dialogue System draws a Unity GUI element, it clips children to the boundaries of the scaled rect. Using the example above, if Dialogue Panel occupies the bottom half of the screen, its children will be clipped to the bottom half of the screen. If you don't want to clip, untick the Clip Children checkbox, which is most of the way down the inspector.

If you know what image size you want to use, you can edit the GUI style assigned to the portrait image. By default, it's 'label', but you can create a custom style for it. Set the Image Width and Height to the size you want.

Please feel free to send an example project to tony (at) pixelcrushers.com. I can sort out the issues and send it back to you.

danieleinseth · Post by **danieleinseth** » Thu Feb 19, 2015 1:26 am

This worked!

Thank you so much, have been stuck on this for longer than I want to admitt. Problem is we're making a game (sort of) but we are three artist. No programmers and no animators, so it's quite the challenge getting things to work.

That's why applications such as yours is such a life saver. Thank you again!

danieleinseth · Post by **danieleinseth** » Thu Feb 19, 2015 3:51 am

One last thing, I am getting this error (including screenshot), and I don't know what it means, or of I need to fix it.