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
displays an animation to indicate that an activity is currently in progress.AssetLoaderdisplays images and other assets.Buttonis a standard push button that may be clicked or tapped.Checkis a check box that may be selected and deselected with a click/tap.Collapsible
displays a header that can be clicked to hide and show its main content.DatePicker
displays a month view where dates may be selected and deselected with a click/tap.Headerdisplays a title with optional views on the left and right sides.HProgressBarandVProgressBardisplays a numeric value with a simple linear fill.HScrollBarandVScrollBardisplay a numeric value with a thumb that may be dragged along a track with step and page adjustments.HSliderandVSliderdisplay a numeric value with a thumb that may be dragged along a track.Labeldisplays text in a single line or multiple lines.NumericStepperdisplays a numeric value in a text input, with buttons to increment and decrement the value.PageIndicatorselects a page index with a basic row of symbols.PopUpDatePicker
pops up a date picker when clicking or tapping a button.Radiobelongs to a group where only one may be selected.TextAreadisplays editable multiline text.TextInputdisplays editable text on a single line.ToggleButtonmay be clicked or tapped to change selection.ToggleSwitchmay 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.
LayoutGroupis the most basic container that supports layout.ScrollContainersupports layout and scrolling.Paneladds a header and footer to a scrolling container.HDividedBoxandVDividedBox
displays views horizontally or vertically, with resizing handles between them.FormandFormItem
groups a set of input controls with labels.
Data containers
Containers that display data from collections, with layout and scrolling.
ButtonBardisplays a row of buttons.ComboBox
pops up a list of data, with a text input for filtering.GridViewdisplays a flat collection of data in multiple columns.GroupListViewdisplays a hierarchical collection of data in a scrollable region.ListViewdisplays a flat collection of data in a scrollable region.PopUpListViewpops up a list of data when clicking or tapping a button.TabBardisplays a row of tabs, where only one may be selected.TreeGridView
displays hierarchical data in multiple columns, and branches may be opened and closed.TreeViewdisplays 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.
ItemRendererdisplays a background skin, up to two lines of text, and an icon.HierarchicalItemRendereris likeItemRenderer, but designed for data containers that display hierarchical data, such asTreeViewandTreeGridView.LayoutGroupItemRendererallows the creation of new types of item renderers with custom content.
Navigators
Containers that support navigation between different views.
PageNavigator
navigates among views using a PageIndicator.RouterNavigator
navigates among views with URL routing and history.StackNavigatornavigates among views with built-in history tracking.TabNavigatornavigates among views using aTabBar.
Miscellaneous
Various other UI components that don't necessarily fit in one of the above categories.
Alertdisplays a pop-up message box, including a title and set of buttons.Applicationis a root component that sets up various managers, including focus, scaling, tooltips, and more.Calloutdisplays content as a pop-up with an arrow pointing at another component.Drawerslides in a view above other content.TextCalloutdisplays text as a pop-up with an arrow pointing at another component.