Skip to content

User Interface

Creating custom interfaces for a Dialogue is fairly straight forward, although we recommend duplicating an existing one and modifying it in order to make the process easier.

Dialogue custom Skin

Advanced Section

Customizing the UI requires certain degree of expertise with Unity and its UI system.

Custom Dialogue Skin

A custom Dialogue Skin interface must have, at the top level game object, a Canvas component and a Dialogue UI component.

The Dialogue UI component is te entry point of a conversation and delegates to its the rest of the child dialogue UI components what to do and when to do it.

Dialogue UI component

The Dialogue UI component has two fields:

  • Speech: A Rect Transform reference where the Speech Skin is instantiated.
  • Default: The default Speech Skin to use, if the current Actor speaker doesn't override it.

This is the bare minimum required to create a custom Dialogue Skin.

Optional Components

There rest of the components mention below are all completely optional.

The Dialogue Unit Timer UI is a component that allows to display a countdown when a choice is presented to the user and has to make a selection before the time runs out.

The Dialogue Unit Choices UI is a component that allows to configure where the choices of an interface go and look like.

Choice by Index

Since version 2.1.7 the Dialogue Choice UI component contains a field called Index which references a Text or Text Mesh Pro Text component, which indicates the index of the choice, starting from 1.

You can use the Choice Index Instruction to attempt to choose an choice by its index. If a choice is available with that idex, it will automatically be chosen.

Using Layout components

We recommend using a layout component, such as Horizontal Layout Group or a Vertical Layout Group in order to automatically align and distribute the choices.

The Dialogue Unit Logs UI is a component that collects and stores past lines delivered and choices, so the user can review them.

The Dialogue Unit Portraits UI is a component that displays Sprite of the current speaker, if any at all.

Custom Speech Skin

A Speech Skin UI prefab must contain, at the root of the game object, the Speech UI component.

Speech UI component

The Active field references a game object from itself that is set as active/inactive, depending on whether a dialogue text is being delivered.

Similarly, the Actor Active field is a optional game object reference that is set as active/inactive, depending on whether the currently delivered line contains an Actor reference or not.

Actor Name and Actor Description, as their name implies, reference a Text component which changes into the current Actor's name and description (if any).

The Active Portrait field is another optional one that sets the game object as active or inactive, depending on whether there Actor asset and chosen Expression contains a Sprite to be used. If it does, the Portrait Image field is used to fill it with the texture value.

The Text field is the most important one, and it references a Text component that changes with the text of the current line being delivered.

The Skip game object is an optional game object reference that is used to mark the end of a sentence. It indicates that the user can press any key to jump to the next dialogue line, and it usually has the shape of a small arrow pointing right or downwards.