Intro to UI components

Feathers UI includes many different types of UI components — from basics like buttons, sliders, and inputs, to scrolling containers, navigation managers, and more. It's also possible to create custom UI components.

Basic UI components

  • ActivityIndicator (Beta)displays an animation to indicate that an activity is currently in progress.
  • AssetLoader displays images and other assets.
  • Button is a standard push button that may be clicked or tapped.
  • Check is a check box that may be selected and deselected with a click/tap.
  • DatePicker (Beta)displays a month view where dates may be selected and deselected with a click/tap.
  • Header displays a title with optional views on the left and right sides.
  • HProgressBar and VProgressBar displays a numeric value with a simple linear fill.
  • HScrollBar and VScrollBar display a numeric value with a thumb that may be dragged along a track with step and page adjustments.
  • HSlider and VSlider display a numeric value with a thumb that may be dragged along a track.
  • Label displays text in a single line or multiple lines.
  • NumericStepper displays a numeric value in a text input, with buttons to increment and decrement the value.
  • PageIndicator selects a page index with a basic row of symbols.
  • PopUpDatePicker (Beta)pops up a date picker when clicking or tapping a button.
  • Radio belongs to a group where only one may be selected.
  • TextArea displays editable multiline text.
  • TextInput displays editable text on a single line.
  • ToggleButton may be clicked or tapped to change selection.
  • ToggleSwitch may be clicked, tapped, or dragged to change selection.

Layout containers

Containers that support layout, with additional capabilities like scrolling and extra chrome like headers and footers.

Data containers

Containers that display data from collections, with layout and scrolling.

  • ButtonBar displays a row of buttons.
  • ComboBox (Beta)pops up a list of data, with a text input for filtering.
  • GridView displays a flat collection of data in multiple columns.
  • GroupListView displays a hierarchical collection of data in a scrollable region.
  • ListView displays a flat collection of data in a scrollable region.
  • PopUpListView pops up a list of data when clicking or tapping a button.
  • TabBar displays a row of tabs, where only one may be selected.
  • TreeGridView (Beta)displays hierarchical data in multiple columns, and branches may be opened and closed.
  • TreeView displays hierarchical data in a list, and branches may be opened and closed.

The following components are designed for rendering each individual item from the container's collection.

  • ItemRenderer displays a background skin, up to two lines of text, and an icon.
  • HierarchicalItemRenderer is like ItemRenderer, but designed for data containers that display hierarchical data, such as TreeView and TreeGridView.
  • LayoutGroupItemRenderer allows the creation of new types of item renderers with custom content.

Containers that support navigation between different views.

Miscellaneous

Various other UI components that don't necessarily fit in one of the above categories.

  • Alert displays a pop-up message box, including a title and set of buttons.
  • Application is a root component that sets up various managers, including focus, scaling, tooltips, and more.
  • Callout displays content as a pop-up with an arrow pointing at another component.
  • Drawer slides in a view above other content.
  • TextCallout displays text as a pop-up with an arrow pointing at another component.