ORK Framework Logo - RPG Editor for Unity
  • Features
  • Showcase
  • Guide
    • Documentation
    • Tutorials
    • API
  • ORK 2
    • Tutorials
    • Plugins
    • API
  • Support
  • Forum
  • Get ORK

Status System Setup

  • START Status System Setup
  • 01 Status Values
  • 02 Status Development
  • 03 Attack/Defence Modifiers
  • 04 Status Effects
  • 05 Formulas
  • 06 Ability & Item Types
  • 07 Abilities Part 1: Attacks
  • 08 Abilities Part 2: Support & Sabotage
  • 09 Abilities Part 3: Elemental Magic
  • 10 Items
  • 11 Equipment Part 1: Slots & Slot Set Templates
  • 12 Equipment Part 2: Weapons
  • 12.5 (Optional) Equipment Part 2.5: Weapons
  • 13 Equipment Part 3: Shields, Armor & Accessories
  • 13.5 (Optional) Equipment Part 3.5: Shields, Armor & Accessories
  • 14 Equipment Part 4: Available Equipment Templates
  • 15 Loot
  • 16 Battle AIs
  • 17 Combatants Part 1: General Settings
  • 18 Combatants Part 2: Players
  • 19 Combatants Part 3: Enemies
  • 20 Combatant Groups
  • END Status System Setup

3D RPG Playground

  • START 3D RPG Playground
  • 01 Player Setup
  • 02 Start Menu
  • 03 First Interaction
  • 04 Music
  • 05 Areas
  • 06 Collecting Items
  • 07 Displaying Equipment
  • 08 Combatant Prefabs, Icons & Portraits
  • 09 Combatant Animations
  • 10 Camera Positions
  • ANIM 01 Battle Start/End Schematics
  • ANIM 02 Use, Cast & Camera
  • ANIM 03 Abilities & Items
  • ANIM 04 Physical Attacks
  • ANIM 05 Special Actions
  • BATTLE 01 Battle Menu
  • BATTLE 02 Prepare for Battle
  • TURN 01 Turn Based Setup
  • TURN 02 Turn Order HUD
  • ATB 01 Active Time Setup
  • ATB 02 Cast Times
  • ATB 03 Timebar HUD
  • BATTLE 03 The First Battle
  • BATTLE 04 Hunting Move AI
  • BATTLE 05 Spawning Combatants
  • 11 Save Games
  • MENU 01 UI Boxes
  • MENU 02 Template HUDs
  • MENU 03 Overview Menu
  • MENU 04 Menu Screens
  • 12 Shop
  • BATTLE 06 Random Battles
  • DUNGEON 01 Enter the Dungeon
  • DUNGEON 02 The Trapdoor
  • DUNGEON 03 Enemies on Level 1 & 2
  • DUNGEON 04 Traps on Level 3
  • DUNGEON 05 Going Deeper
  • 13 Bestiary (+MENU+ANIM)
  • QUEST 01 Hunting Quests (+MENU)
  • QUEST 02 Guard NPC
  • QUEST 03 Forest Ruin Cheese
  • QUEST 04 Witch NPC with Cheese
  • QUEST 05 Quest Mark HUDs
  • 14 Research Trees (+MENU)
  • CRAFT 01 Crafting Materials
  • CRAFT 02 Crafting Recipes
  • CRAFT 03 Crafting Menu
  • CRAFT 04 Crafting Proficiency & Critical Crafting
  • CRAFT 05 Materials Loot
  • 15 Changing Choice Dialogue
  • 16 Follow Me!
  • BATTLE 07 Sequence Loot Dialogue

3D Action RPG

  • START 3D Action RPG
  • 01 Status System Setup
  • 02 Player Setup
  • 03 Player Weapon
  • 04 Player Attacks
  • 05 Enemy: Chomper
  • 06 Chomper Attack
  • 07 Hit & Death
  • 08 HUDs
  • 09 Rolling on the Floor
  • 10 Enemy: Spitter
  • 11 Spit Attack
  • 12 Potion
  • 13 Grenade
  • 14 Item HUD
  • 15 Enemy: Grenadier
  • 16 Grenadier Melee Attacks
  • 17 Grenadier Flamethrower
  • 18 Item Drops
  • END 3D Action RPG

2D Grid Battle RPG

  • START 2D Grid Battle RPG
  • 01 Player Setup
  • 02 Prefab & Music Setup
  • 03 Randomizing Combatants
  • 04 UI Setup
  • 05 Battle Start, End & Phase Schematics
  • 06 Battle System Setup
  • 07 Battle Grid Setup
  • 08 Grid Move
  • 09 Forest Battle Grid
  • 10 Battle AI
  • 11 Ability Ranges
  • 12 Death & Use Schematics
  • 13 Attack Schematic
  • 14 Shoot Schematics
  • 15 Battle Selection Interaction
  • END 2D Grid Battle RPG

Schematics

  • Simple Start Schematic
  • Battle Start Schematic
  • Battle End Schematic
  • Moving to Target and Back
  • Animating a Base Attack
  • Animating a Magic Ability
  • Grid Movement
  • Open and Close UI Animations
  • Flying Text Mover

UI Setups

  • Unity UI: Initial Setup
  • Unity UI: TextMesh Pro Setup
  • Unity UI: UI Box
  • Unity UI: Flying Text
  • Unity UI: Dragging Notification
  • Unity UI: Interaction HUD
  • Unity UI: Simple Player HUD
  • Unity UI: Quest HUD
  • Unity UI: Shortcuts HUD
  • Unity UI: Currency HUD
  • Unity UI: Tooltip HUD
  • Unity UI: Control HUD
  • Unity UI: Attack Modifiers
  • Unity UI: Defence Modifiers

Gameplay Bits

  • Combining Input Origins
  • Combining Status Value Flying Texts
  • Fun With Flying Text
  • HUD Effects With Conditional Schematics
  • Inventory Containers
  • Multi Interaction Controllers
  • World Space HUD
  • World Space Dialogue
  • Home
  • Guide
  • Tutorials
  • Gameplay Bits
  • World Space Dialogue

World Space Dialogue

Table of Contents
  • World Space Canvas on NPC
    • Canvas
    • Rect Transform
  • UI Box
    • Prefab Setup
      • Rect Transform
      • Styling
      • Create a prefab
    • UI Box Setup
      • Unity UI
      • Save Changes
  • Updating NPC Dialogue Schematic
    • Show Dialogue
  • Testing
  • Tip: Not using the canvas

Learn how to show a dialogue on a world space canvas (Unity UI module).

UI boxes (and other UI) are usually shown on a screen space canvas when using the Unity UI module, but you can show them on a world space canvas when displaying the UI box at the position of a game object, e.g. the speaker of a dialogue. This is done by having a Canvas on the game object the UI box is using for positioning.

Since this requires the UI box to use a game object for positioning, it’s only possible for UIs that are displayed that way, e.g. Show Dialogue nodes displaying at the speaker’s position or Action Info Notifications displaying at the combatant’s position.

This tutorial is based on the 3D RPG Playground series, but you can use this for any kind of project. We’ll turn the dialogue of the concerned citizen of the 3D RPG Playground series into a world space dialogue.

For this, we’ll set up the following:

  • add a canvas to the NPC
  • a new UI box
  • change the dialogue schematic

Let’s get to it!

World Space Canvas on NPC #

To show the dialogue in world space, we’ll add a canvas as a child object of the NPC’s game object.

Open the World scene (Assets/Scenes/) and select the Casual3_Male game object in the town (or whatever NPC prefab you’ve used).

Add an empty game object as a child object to the NPC’s game object and name it UI.

Canvas #

Add a Canvas component to the UI child object using the component menu.

This’ll turn the game object’s transform into a Rect Transform (we’ll handle it’s setup shortly) and the added canvas should already be a World Space canvas.

  • Render Mode
    Select World Space.

Rect Transform #

We need to adjust the position, rotation, scale and size of the canvas, or it’ll be gigantic.

  • Pos Y
    Set to 4.
  • Rotation
    Set to X=0, Y=180, Z=0.
    We need to rotate it by 180 on the Y axis or it’ll face to the other side of the NPC.
  • Scale
    Set to X=0.01, Y=0.01, Z=0.01.
  • Width
    Set to 200.
  • Height
    Set to 200.

Depending on your project and UI boxes you might need to adjust those values a bit.

And that’s it for the NPC’s game object – don’t forget to save your changes in the scene.

UI Box #

Next, we’ll set up a new UI box.

Prefab Setup #

Even on a world space canvas, the UI box will be placed based on the prefab’s setup (i.e. anchor preset, position, etc.).

We’ll set up a UI box that adjusts it’s height to the displayed content (growing upwards) and is displayed with it’s bottom edge at the center of the canvas.

Use the scene hierarchy context menu to create a fit size UI box variant: Makinom > UI Box > UI Box Fit Size with Title

Rect Transform #

Select the created UI Box game object and change the settings in the following order.

Select the middle center anchor presets (should be the default).

  • Pivot
    Set to X=0.5, Y=0.
  • Pos Y
    Set to 0.

Styling #

Style the box the way you want, e.g. I’m using the BoxBeige sprite as background (with a white color with full alpha value to make it completely opaque) for the content and title box.

I’m using a black font color (TextMeshPro – Text components for content and title) and increase the padding of the layout group components on the UI box and title box.

It should now look something like this.

Create a prefab #

Create a prefab out of the UI box, e.g. save it as UI Box Beige World Space Dialogue.

Don’t forget to remove the Canvas from the scene in case you did this in one of the game scenes.

UI Box Setup #

Open the Makinom editor, navigate to UI > UI Boxes and create a new UI box.

  • Name
    Set to World Space Dialogue.
  • UI Layer
    Select Layer 1.
    In case the UI box is used without a game object of on a game object without a canvas, it’ll be displayed on this UI layer.
    When displaying on a world space canvas, the UI box will not use the defined UI layer.

Unity UI #

  • UI Box Prefab
    Select the UI Box Beige World Space Dialogue prefab we just created.

Save Changes #

That’s it for the UI box setup.

Don’t forget to save your changes by clicking on Save Settings at the bottom of the editor.

Updating NPC Dialogue Schematic #

Navigate to Schematics and open the ChangingDialogue schematic. Alternatively, you can also click on Edit Schematic in the NPC’s Interaction Machine component to directly open the schematic.

We only need to change certain Show Dialogue nodes – i.e. the ones where the NPC (Actor 1) is speaking.

I’ve circled them red in this image:

Show Dialogue #

The change is the same for all 4 Show Dialogue nodes.

  • UI Box
    Select World Space Dialogue.

The dialogue already uses a speaker (Use Speaker being enabled), so we only need to enable showing it at the speaker’s game object and use the UI child object we set up.

  • Display At Actor
    Enable this setting.
  • Path to Child
    Set to: UI

Don’t forget to repeat the setup for all 4 NPC dialogue nodes.

And that’s it – click on Save Schematic to save the changes.

Testing #

Hit play, go to the NPC and start the dialogue.

The NPC’s responses are now shown in world space – it works!

The player’s dialogues are still displayed in regular screen space. You can naturally also change that if you want – inputs still work when used in world space.

Tip: Not using the canvas #

Sometimes you might want to display a UI box (or other UI) at the position of a game object without using a canvas that’s on it, i.e. still display it as a regular screen space UI.

For this, disable the At Game Object Canvas setting in the UI Box component (or HUD component for HUDs). The option is enabled by default, disabling it will not use any canvas attached to game objects the UI is displayed at.

UI
Share This Article :
  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
Updated on February 26, 2022
Table of Contents
  • World Space Canvas on NPC
    • Canvas
    • Rect Transform
  • UI Box
    • Prefab Setup
      • Rect Transform
      • Styling
      • Create a prefab
    • UI Box Setup
      • Unity UI
      • Save Changes
  • Updating NPC Dialogue Schematic
    • Show Dialogue
  • Testing
  • Tip: Not using the canvas
Sitemap
  • Features
  • Showcase
  • Guide
    • Documentation
    • Tutorials
    • API
  • ORK 2 Hub
    • Tutorials
    • Plugins
    • API
  • Support
  • Forum
  • Get ORK
  • Contact
  • Blog
  • Makinom
  • gamingislove.com
Categories
  • News (59)
  • ORK 2 (137)
    • Tutorial (137)
      • Game tutorial (50)
      • Gameplay (32)
      • How-to (55)
  • Release (129)
Search

© 2015 Gaming is Love e.U.

Disclosure: This site may contain affiliate links, which means I may receive a commission if you click a link and purchase something that I have recommended. While clicking these links won’t cost you any money, they will help me fund my development projects while recommending great assets!