Skip to main content

Hierarchy

The Hierarchy panel allows you to manage the structure of your UI elements. Here you can nest widgets within each other, creating parent-child relationships where the container widget becomes the parent and the elements inside it become child widgets.

Widget structure in the Hierarchy​

Each widget in the Hierarchy consists of:

  • Dropdown arrow icon
  • Widget icon - helps visualize the widget type
  • Widget name

thermostat

Each hovered widget consists:

  • Duplication icon
  • Deletion icon

thermostat

Widget functions in the Hierarchy​

  • Rename widgets by double-clicking on them in the hierarchy
  • Duplicate widgets using the duplication icon
  • Remove widgets from both hierarchy and screen using the minus icon
  • Copy and paste elements with keyboard shortcuts Ctrl+C/Cmd+C and Ctrl+V/Cmd+V

Organization​

Rearrange elements using drag and drop to properly structure your project and control how layers appear on the screen canvas. This affects the visual stacking order of widgets.

Click the search icon to locate specific widgets within the hierarchy. Close the search function by clicking the X button when finished.

Panel customization​

The panel can be freely positioned anywhere in the editor, and its size can be customized by dragging its edges. Use the icon in the top-right corner to maximize the tab size. When maximized, the same icon returns the panel to its previous size.