Components
PUBLISHED
UI components are interactive components for layout and scrolling the user interface. NUI provides UI components, such as buttons, scroll view, table view, text controls, image view, flex container, slider, and video view.
Figure: UI components
The following table lists the available UI components:
Table: UI components
Control | Description | Related classes |
---|---|---|
Button [1] | A button that can set action when user select it. | Button |
FlexContainer [2] | A FlexContainer implements a subset of the flexbox spec. | FlexContainer |
ImageView [3] | An image view is a class for displaying an image resource. | ImageView |
Loading [4] | A loading is used to give information about the ongoing operations. | Loading |
Popup [5] | A popup is used as a popup window. | Popup |
Progress [6] | A progress is used to show the ongoing status using a long narrow bar. | Progress |
Scrollbar [7] | A scrollbar is used to show the range of content. | ScrollBar |
Slider [8] | A slider that indicates a modifiable value within a specific range. | Slider |
Switch [9] | A switch that can be used as a selector. | Switch |
Tab [10] | A tab is easy to explore and switch between different views. | Tab |
TableView [11] | A table view that can align child actors in a grid like layout. | TableView |
TextEditor [12] | A text editor that provides a multi line editable text. | TextEditor |
TextField [13] | A text field that provides a single line editable text. | TextField |
TextLabel [14] | A text label that renders a short text string. | TextLabel |
Toast [15] | A toast is used to provide simple messages. | Toast |
VideoView [16] | A video view that controls and displays video playback. | VideoView |
The base class for the components is View
. This class can also be used to create your own custom UI components. For more information on the view class, see View [17]. In this UI Components guide, both the terms control and component are used to refer to a UI component.
You can customize the look of the UI components with stylesheets [18]. For a reusable rendering logic that can be used by all UI components, take advantage of visuals [19].