Hi,
Nice art!
I'll show the steps I used to add dialogue bubbles to AC's 2D Demo scene. I'm going to include lots of screenshots, so don't let the length of this post intimidate you. It's all pictures.
Dialogue bubbles require a little extra setup. Unintuitively, that initial setup is a little more complicated in 2D because the bubbles use a type of UI called "world space". World space UIs were originally designed for 3D, but they work fine in 2D with the steps below. But first we'll get the basic dialogue set up:
1. To tell AC that we're using the 2D Demo, I inspected AdventureCreator / 2D Demo / ManagerPackage and clicked
Assign managers:
2. I didn't want to have to sit through the intro while playtesting, so I inspected the OnStart cutscene and disabled the last action:
3. I added the Dialogue Manager prefab and left the Basic Standard Dialogue UI assigned to the
Dialogue UI field. It's OK because we're not going to end up using it. I also assigned a dialogue database containing a test conversation and added an Adventure Creator Bridge component:
4. The TyreSwing was close at hand, so I chose it to be the NPC in this example. I changed its hotspot's
Use interaction to point to a new interaction that I named "Tyre swing: Use Conversation":
5. I configured this interaction to start a Dialogue System conversation, and specified that the conversant is the TyreSwing GameObject.
At this point, if you play the scene, it will look similar to your screenshot:
So now we just need to add the dialogue bubbles. As I mentioned before, this is where 2D requires an extra step. We're going to create a special camera to draw the bubbles on top of whatever else is in the scene.
6. In the Hierarchy, right-click on MainCamera, and select Camera. This will add a new child camera. I named it UICamera and configured it like this:
7. Then inspect the MainCamera, click the
Culling Mask dropdown, and deselect
UI:
The MainCamera, which has a Depth of -1, will first draw everything except objects on the UI layer. Then the UICamera, which has a Depth of 0, will draw only objects that are on the UI layer.
8. Now we need to add our bubble and put it on the UI layer. From the Project view, drag Prefabs / Templates / Bubble / Bubble Template Standard UI Subtitle Panel to be a child of TyreSwing:
9. Add a
Dialogue Actor component to TyreSwing. Select the actor that it represents, change
Dialogue UI Settings > Subtitle Panel Number to
Custom, and assign the Bubble Template Standard UI Subtitle Panel child that you just added:
10. Inspect the Bubble Template Standard UI Subtitle Panel child. Set the layer to UI. (Answer 'Yes' to include all children.) Adjust it so that it looks right. I used these settings:
which looks like this:
11. When you play the scene and interact with the TyreSwing, it should look like this:
You can save your customized Bubble Template Standard UI Subtitle Panel child as a new prefab, and assign that prefab to Dialogue Actor components in the future instead of having to add child objects to everything.
