O3DE UI Component Library
In the Open 3D Engine (O3DE) UI component library, you will find an explanation of each UI component (i.e. widget), along with guidelines for their usage. Typically, each page contains the following information:
- Use cases
- Screenshots and explanations of component features
- Usage guidelines
- Code snippets showing you how to use the most common features
- Links to C++ API reference page for each component
- Links to related information in the Qt widget library
Components
- Breadcrumb Navigation
- Browse edit
- Button
- Card
- Checkbox
- Combobox
- Context menu
- Filtered search
- Line edit
- Progress indicators
- Radio button
- Reflected property editor
- Scrollbar
- Slider and slider combo
- Spinbox
- Styled dock
- Tab
- Table view
- Toggle switch
- Tree view
Additionally, a complete guide to the C++ API can be found in the O3DE UI Extensions C++ API Reference.
Breadcrumb Navigation
Use the O3DE UI breadcrumbs component as a navigational tool to show users where they are along a hierarchical path. Breadcrumbs also enable users to jump to a different point in the path.
Browse Edit
Use the O3DE UI browse edit component to enable users to choose one or more values from a list or directory.
Button
Learn how to apply the O3DE UI styles for push buttons and tool buttons in O3DE Gems and tools.
Card
Use the O3DE UI card widget as a container to organize component property settings and actions together.
Checkbox
Learn how to use O3DE UI checkboxes in O3DE Gems and tools.
Combobox
Learn how to use the O3DE UI combobox component in O3DE Gems and tools.
Context Menu
Use the O3DE UI context menu component to display a popup menu with a list of context-appropriate actions.
Filtered Search
Learn how to use the O3DE UI filtered search widget to give users advanced search options in your O3DE tools and Gems.
Line Edit
Use the O3DE UI line edit component to capture free-form text from the user.
Progress Indicators
Learn about the O3DE UI progress indicators, including the spinner and progress bar components.
Radio Button
Learn how to apply the O3DE UI style for radio buttons in O3DE Gems and tools.
Reflected Property Editor
Use the O3DE UI reflected property editor to automatically lay out user-editable properties in O3DE tools and Gems.
Scrollbar
Learn about the O3DE UI customizations to the scrollbar style in O3DE tools and Gems.
Sliders
Learn about the O3DE UI style of sliders, including the slider and slider combo components.
Spinbox
Learn about the O3DE UI style of spinboxes, including the spinbox and double spinbox components.
Styled Dock
Learn how to use the O3DE UI styled dock widget with the dock main window component, to enable fancy docking in O3DE tools and Gems.
Tab
Learn how to use the O3DE UI tab widget component to create tabs and tab action bars in O3DE tools and Gems.
Table View
Learn how to use the O3DE UI table view component to present columns of structured data in O3DE tools and Gems.
Toggle Switch
Learn how to apply the O3DE UI toggle switch style to a checkbox component in O3DE gems and tools.
Tree View
Learn how to use the O3DE UI tree view component to give users a file or list navigation interface in O3DE tools and Gems.