Showing with UI
- Game Development course
- Advanced
- Lesson 35/71
- 4 min
Learn to show dialogue lines with UI Text.
UI Display and TextMeshPro
To render crisp and readable dialogue text, Unity uses TextMeshPro (TMP). On the Canvas, UI elements for speaker title and body lines are established.
using TMPro;
using UnityEngine;
public class DialogueUI : MonoBehaviour {
public TextMeshProUGUI speakerText;
public TextMeshProUGUI dialogueText;
}The TextMeshProUGUI component delivers sharp text rendering across all display resolutions via signed distance field font atlases.
Updating Text and Button Listeners
When the dialogue runner steps onto a new line, it updates the text components immediately. For choice nodes, target callbacks are registered to the buttons' onClick events.
public void ShowLine(string speaker, string content) {
speakerText.text = speaker;
dialogueText.text = content;
}Visual enhancements like a typewriter effect are introduced at this UI layer using a coroutine.
Practice Updating UI text
Define a Start method. Inside, declare string replik = "Gorev tamamlandi!"; and print "UI metni: " + replik to the console.
Starter code
using UnityEngine;
public class DialogueUITester : MonoBehaviour
{
// Start icinde replik tanimla ve yazdir
}Sample solution
using UnityEngine;
public class DialogueUITester : MonoBehaviour
{
void Start()
{
string replik = "Gorev tamamlandi!";
Debug.Log("UI metni: " + replik);
}
}Expected output
UI metni: Gorev tamamlandi!
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 Which component is preferred in Unity UI to render high-quality scalable dialogue text?
- Rigidbody2D
- BoxCollider
- AudioSource
- TextMeshProUGUI Correct answer
Explanation: TextMeshProUGUI is the standard UI component for high-fidelity text rendering in modern Unity projects.
2 Update dialogue text
dialogueText.____ = "Hos geldin maceraci!";dialogueText.text = "Hos geldin maceraci!";Explanation: The 'text' property of the TextMeshPro component is assigned to alter the displayed string.
3 UI display components
| Term | Meaning |
|---|---|
TextMeshProUGUI |
UI dialogue text component |
speakerText |
UI field displaying speaker name |
dialogueText.text |
Property updating dialogue line text |
Button.onClick |
Event fired when an option is picked |