2D Toolkit Dialogue UI

The TK2D Dialogue UI uses 2D Toolkit to display conversations, QTEs, and alerts. You can assign a prefab or a scene instance. If you plan to use portrait images for your actors, you should add an instance to the scene so you can assign a sprite collection to use for the portrait images. (See below for more information.)

To create your own layout, you can copy and customize the provided basic prefab, or follow these steps:

  1. Create a GameObject with a TK2DDialogue UI component (Component → Pixel Crushers → Dialogue System → Third Party → 2D Toolkit → Dialogue UI).
  2. Create your TK2D interface as a child of the TK2DDialogue UI GameObject. The root of the interface should be a tk2dUILayout. The prefabs use layer 8 for all UI components.
  3. Assign a TK2DResponse Button component to each response button.
  • In the TK2DDialogue UI component, assign the UI control properties. At a minimum, you must assign these controls:
    • UIRoot Layout
    • NPC Subtitle Line
    • PC Subtitle Line (if you will be showing PC subtitles)
    • One or more Response Menu Buttons
    • Alert Line
  • If you add a TK2DFader to the Alert Panel and/or Line, the UI will fade it in and out when displaying. Note in the prefabs that NPC Subtitle Line has a fader, but NPC Subtitle Reminder Line doesn't.
  • If you're going to require the player to choose a response before a timer runs out, also add a tk2dProgressBar for the timer control, add a TK2DTimer, and set the timer property in the Dialogue Manager's Display Settings → Input Settings.
  • If you want to add continue buttons to require the player to click past subtitles and/or alert messages, point the continue button's handler to the dialogue UI, and select the OnContinue method.
  • Alerts can have, in addition to the alert line, an optional parent panel that can contain any other controls that you want to show, including an optional continue/close button. If you add a panel or continue button, make sure to add them to the corresponding TK2DDialogueUI properties.
  • Your scene also needs a camera object with tk2dCamera and tk2dUICamera, and a tk2dUIManager. If you use the same format as the prefabs, make sure the tk2dUICamera is configured to use layer 8 so it can detect clicks on the controls (which are on layer 8).

Actor Portraits: In the 2D Toolkit dialogue UI, portrait images don't use the actor's texture in the dialogue database. Instead, they use a sprite collection to reduce draw calls. In the TK2DDialogue UI, set the sprite collection containing the textures. Each portrait in the collection should match the actor's name as defined in the dialogue database.

For any sprites in your UI (QTE indicators are good candidates), you can use a tk2dSpriteAnimator to animate them. (The included prefabs simply display the basic sprite on the screen.) If you use a tk2dSpriteAnimator, tick Play Automatically to make sure the animation plays whenever the QTE indicator is shown.


<< 2D Toolkit Support