Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.kodeflowstudios.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Setup the UI

In the Hierarchy, right-click and create UI Document with “UI Toolkit/UI Document”. Select it, and choose “UIToolKitBasePanel” for the Panel Settings field, and “UIToolKitBase” for the Source Asset field. These two come prepackaged with Parley to make things easier for you to get started.

​
Writing the Dialogue

Create a folder at Resources/English/Emotions/Create the following file inside it:
en.Example.yaml
Dialogue:
  node_1:
    Speaker: "Mike"
    Emotion: "Neutral"
    Text: "Hi, I heard you wanted to see my emotional range."
    NextNode: node_2
  node_2:
    Speaker: "Mike"
    Emotion: "Happy"
    Text: "This is me happy"
    NextNode: node_3
  node_3:
    Speaker: "Mike"
    Emotion: "Sad"
    Text: "This is me sad"
    NextNode: node_4
  node_4:
    Speaker: "Mike"
    Emotion: "Angry"
    Text: "And this is me angry!"

​
Setting up the Script

With the file ready, let’s get into the script.Create a C# script and name it something like YamlEmotionsUIToolKit.cs and write the following.
YamlEmotionsUIToolKit.cs
using System;
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using KodeFlowStudios.Parley.YamlCore;

public class YamlEmotionsUIToolKit : MonoBehaviour
{
	public UIToolKitHandler uiToolKitHandler;

	// Serializable class to hold emotion-sprite pairs for inspector 
	// assignment since Unity doesn't serialize dictionaries.
	[Serializable]
	public class SpriteEntry
	{
		public string emotion;
		public Sprite sprite;
	}
    public SpriteEntry[] sprites;
    private Dictionary<string, Sprite> lookup;

	ParleyYaml parleyYaml;

	void Awake()
	{
        lookup = sprites.ToDictionary(e => e.emotion, e => e.sprite);
	}

    void Start()
    {
		Dialogue();
    }

	Sprite GetImage(string emotion)
	{
		if (lookup.TryGetValue(emotion, out Sprite sprite))
		{
			return sprite;
		}
		else
		{
			Debug.LogWarning($"Emotion '{emotion}' wasn't found in sprites dictionary.");
		}
		return null;
	}

	async void Dialogue()
	{
		parleyYaml = new ParleyYaml("Examples", "Emotions");

		while (parleyYaml.ConversationEnded != true)
		{
			uiToolKitHandler.SetSpeakerNameText(parleyYaml.CurrentNode.Speaker);
			uiToolKitHandler.SetDialogueText(parleyYaml.CurrentNode.Text);

			if (!string.IsNullOrEmpty(parleyYaml.CurrentNode.Emotion))
			{
				Sprite imageSprite = GetImage(parleyYaml.CurrentNode.Emotion);
				uiToolKitHandler.SetImageSprite(imageSprite);
			}

			await parleyYaml.OnNextDialogue;
		}

		parleyYaml = null;
	}
}

​
Wiring things up

Back in the unity editor, add that script to the UI Document object we made earlier in the UI section, and click on the “Add Component” button and add a “UI ToolKit Handler” script, this also comes with Parley to handle all the functions we use to set UITK scenes.Assign the UI Document field in the UI ToolKit Handler component to the UI Document component above it.In the Graph Emotions UI ToolKit script, set the UI Took Kit Handler component to the UI ToolKit Handler component we added earlier. And create 4 sprite entries with the exact same emotions in the file, and assign each sprite.You should be left with something like this:Script Variable Fields

​
Testing

Hit play. Left click in the Game View to advance through the dialogue — you should see the speaker and text update with each click, the sprite gets set, and the dialogue ends cleanly on the last node.