Page 1 of 4

How to add image in dialogue

Posted: Sun May 01, 2016 2:36 am
by supadupa64
How can I add an image in a dialogue conversation?

Re: How to add image in dialogue

Posted: Sun May 01, 2016 10:44 am
by Tony Li
What kind of image?

To show actor portrait images like below:
Image
assign images to the actors in your dialogue database, and configure your dialogue UI with UI elements for portrait images. (The Unity UI Generic Dialogue UI is configured for portrait images if you want to see an example, as is the Mobile prefab shown above.)

If you want to show images inline with your text, I recommend buying TextMesh Pro. Neither Unity UI nor legacy Unity GUI have built-in support for inline images. But with TextMesh Pro you can do things like this:
Image

If you just want an image to appear on the screen, you can use the SetActive() sequencer command. Create a GameObject with an image (for example, a Unity UI Image in a Canvas) and set it inactive. Then use SetActive() to activate the GameObject at the desired time.

Re: How to add image in dialogue

Posted: Sun May 01, 2016 11:01 am
by supadupa64
I'm looking to have an image of a quest item appear in the dialogue. Thanks for the idea! I'll just use the setactive sequence. I'm a fan of that.

Re: How to add image in dialogue

Posted: Mon May 02, 2016 4:34 am
by supadupa64
This is slightly unrelated, but I figure it is probably related somehow to dialogue UI. I'm using a camera with an image of my quest item to show during the dialogue screen.

The problem is that if the screen size changes, the image will be in a different spot. I'm trying to lock it into the dialogue ui so it shows the same size every time on the screen. The camera with image is currently behind the dialogue, which I assume is an easy fix also if I can adjust the canvas order somehow. See image below:

1) Keep image same size so it fits in dialogue window
2) Place image in front of dialogue window
dialogueUI.jpg
dialogueUI.jpg (166.16 KiB) Viewed 3607 times

Re: How to add image in dialogue

Posted: Mon May 02, 2016 8:15 am
by Tony Li
A common way to do this is to use a render texture.

1. Create a render texture in your project.

2. Set up your camera so it's pointing to the object. Assign your render texture to the camera's Target Texture.

3. Add a Raw Image UI element to your UI, and assign the render texture to it.

Re: How to add image in dialogue

Posted: Mon May 02, 2016 9:58 am
by supadupa64
Great, so I've got it working, I think. I say I think because it shows behind the dialogue window and I'm trying to figure out how to bring it to the front. I really appreciate the help!!!

Re: How to add image in dialogue

Posted: Mon May 02, 2016 11:18 am
by Tony Li
Are you using a render texture, or are you rendering straight from the camera? The render texture gives you the most control over positioning.

If you're rendering straight from camera (let's call it Camera2), set your canvas to Screen Space - Camera and assign a camera. Then set Camera2's Depth field to a higher value than the camera assigned to the Screen Space - Camera canvas. This will make it render on top of the canvas.

Re: How to add image in dialogue

Posted: Mon May 02, 2016 12:14 pm
by supadupa64
Yeah I was doing that and it doesn't work because of the screen size changes, then the camera position changes. So I started using a texture render which I think works perfect except it's not rendering on top the dialogue window.

Re: How to add image in dialogue

Posted: Mon May 02, 2016 12:44 pm
by Tony Li
Is your render texture vertically lower in the Hierarchy view? Unity UI renders things from top to bottom in the Hierarchy, so the UI elements that are lower down are rendered on top.

When you play the game and bring up the window, switch over to the Hierarchy view and play with the order to get it the way you want. Then stop the game and make the same changes at design time.

Re: How to add image in dialogue

Posted: Mon May 02, 2016 1:43 pm
by supadupa64
I think the problem might be the UI. I use another scene for my UI which includes main menu and pause menu stuff. But my main scene uses Dialogue Manager which holds my dialogue UI stuff. It doesn't work if I try to put it in the Dialogue UI. I've moved it all around and it doesn't show above. I don't know if there is a right way to set up a UI, but I have UI's in two different scenes.