Unity Cookbook
  • 2D
    • New Input System - 2D Move
    • Pixel Sprite Setup
    • Animations
    • Animator in Script
    • Tilemap
    • 2D Camera Follow Player
  • UI OnlyFans
    • 9-Splice Sprite
    • Interactible Game Objects
      • NPCs
      • Items
      • Interactible Marker
    • Dialogue System
      • Conversa Plugin
      • DiaManager.cs
      • DiaTrigger.cs
      • DiaManager.cs Alternate
      • Choices in Dialogue
    • New Input System - Interact
    • Designing the General Menu
    • New Input System - Open Menu
      • UI Buttons
      • GeneralMenu.cs
    • Controls Explanation UI
    • Items Menu
Powered by GitBook
On this page
  • Overview
  • Super Helpful Note
  • Creating the UI for the Dialogue Box
  • Creating TMP Fonts
  • DiaManager.cs
  • Hide UI
  • Show UI
  • DiaTrigger.cs
  • Closing the Dialogue
  1. UI OnlyFans

Dialogue System

PreviousInteractible MarkerNextConversa Plugin

Last updated 1 year ago

Overview

Two scripts will be needed. The one that manages the UI. The other, triggers that contain their own unique content.

// The UI Controller Script
DiaManager.cs

// The Triggers that will change on each conversation
DiaTrigger.cs

Reference Video:

Super Helpful Note

If you click on a GameObject in the scene view, then hover you mouse over the scene window and then hit "F" it will focus the view on that object. This is useful because canvases are huge in the Unity UI.

Creating the UI for the Dialogue Box

Creating TMP Fonts

Then remember to save the file. Take the original file name and add "_TMP" at the end to keep track of what is a TMP font.

DiaManager.cs

This is only added once for the entire game. Add these basic functions. Remember, these need to be public so that the trigger can communicate with it.

// Show the Dialogue Manager UI with Messages
public void ShowMessage(string actor, string message, Action action) {}

// Show Choices
public void ShowChoice(string actor, string message, Option[] options);

// Hide the Dialogue Manager UI
public void Hide();

Add the packages at the top, before the Monobehaviour line.

using UnityEngine.UI;
using TMPro;

Setting up variables in the script. We need to hook up the UI components to the script.

//UI GameObjects
public Image Portrait;
public TMP_Text ActorNameText;
public TMP_Text MessageText;
public RectTransform MessageBackgroundBox;

public GameObject ActorsPanel; //If we have a message with actor info
public GameObject DialogueUI;  //The entire system

Note the updated hierarchy in the scene list.

Add the DiaManager.cs script to the UI parent gameobject. Then hook up the things.

We also need to know when the UI is open, so that we can close it. We'll just be checking if the dialogue box is open with:

if (DialogueUI.activeInHierarchy == true) {}

Hide UI

Now to start with the first function. This is the Hide function.

//Input System Connection
[SerializeField] private PlayerInput playerInput;

//Initial State of the Game
private void Start() 
{
    //I've put the playerInput component on the Player GameObject, hence the tag
    playerInput = GameObject.FindWithTag("Player").GetComponent<PlayerInput>();
    Hide();
}

//Hiding the Dialogue UI
public void Hide()
{
    //First, check if the Dialogue UI is open in the scene
    if (DialogueUI.activeInHierarchy == true) 
    {
        DialogueUI.SetActive(false);
        
        //This switches to the non-UI actionmap created for the player moving in the world
        playerInput.SwitchCurrentActionMap("World"); 
    }
}

Show UI

This has options for with or without the actor. For some reason, I can't pass the sprite as a variable.

//Showing the Dialogue UI
public void Show(string message, string actorName = null)
{
    MessageText.text = message;

    if (actorName != null)
    {
        ActorsPanel.SetActive(true);
        ActorNameText.text = actorName;
    }
    else
    {
        ActorsPanel.SetActive(false);
    }
}

...

//Using this later
Show("Some new line of text.");

DiaTrigger.cs

This will be added to all Interactible GameObjects. It will open the functions in the DiaManager and pass information to it.

//How to find the only object in the scene
FindObjectOfType<DiaManager>();

When the trigger is hit by the interact raycast, we need the conversation to begin. We'll add in a public function.

public void Begin() {};

It needs to send the variables to the DiaManager. These are all the Variables:

public string TriggerMessage;
public string TriggerActorName;
public Sprite TriggerPortrait;

For some reason, I can't share the "Sprite" image into the UI Image although the videos show this is possible. I give up.

Closing the Dialogue

Simply add a second Hide() function in the DiaManager.cs. Then, drag it onto the OnSubmit event in the Player Input from the Inspector. Why do we do this? Well, if you're using the space bar to begin the conversation, this without the callbackContext fires the regular Hide() function immediately, so the conversation just blips on the screen. This makes sure that the second function has to wait until the next key press.

public void HideAtEnd(InputAction.CallbackContext ctx)
{
    if (ctx.started)
    {
        Hide();
    }
}
https://youtu.be/PswC-HlKZqA?si=sjOrSJlxms0ay4zm