UI
The Visual Tree

UIElements Developer Guide

The goal of this guide is to help you take advantage of UIElements by describing the concepts behind the framework and by providing you with a clear explanation of how to build an interactive user interface with UIElements.

The UIElements Developer Guide is split into the following sections:

  • The Visual Tree: Holds all the visual elements in a window. The visual tree is an object graph made of lightweight nodes referred to as visual elements. See this topic for information on the visual tree, visual elements, connectivity, drawing order, and more.
  • The Layout Engine: Positions visual elements based on layout and styling property. See this topic for more on the layout engine.
  • The UXML format: Defines the structure of the user interface. See this topic for details on writing, loading, and defining Unity eXtensible Markup Language (UXML) templates.
  • Styles and Unity style sheets (USS): Defines the style properties that set the dimensions and appearance of visual elements. See this topic for details on USS, its syntax, and its differences compared to Cascading Style Sheets (CSS).
  • The Event system: Communicates user interactions to visual elements. See this topic for details on how to use the event dispatcher, event handler, event synthesizer, and event types for handling user interactions with UIElements.
  • Built-in controls: See this topic for a list of standard controls that are built into UIElements.
  • Binding: Links a property to the visual control that modifies the value of the property. See this topic for more information on how to bind a property to a control.
  • Supporting IMGUI: See this topic for information on how to use IMGUI code with UIElements.
  • ViewData persistence: Persists UI-specific state data. See this topic for information on how to store and retrieve state data after a domain reloads or when the Editor restarts.

UI
The Visual Tree