UI Components

UI components are interactive components for layout and user interface. NUI provides UI components, such as buttons, table view, text controls, image view, flex container, slider, and video view.

Figure: UI components

UI components UI components

The following table lists the available UI components:

Table: UI components

Control Description Related classes
Button A button that can set action when user select it. Button
CheckBox A CheckBox that can set selected or unselected status when user selects it. CheckBox
ImageView An image view is a class for displaying an image resource. ImageView
Loading A loading is used to give information about the ongoing operations. Loading
LottieAnimationView A LottieAnimationView is used to show a vector animation. LottieAnimationView
Notification A notification is used to pop-up a notification window with a content view. Notification
Pagination A Pagination is used to show the number of pages available and the currently active page. Pagination
Popup A popup is used as a popup window. Popup
Progress A progress is used to show the ongoing status using a long narrow bar. Progress
RadioButton A RadioButton that can set selected or unselected status when user selects it. RadioButton
ScrollableBase A ScrollableBase that can support scrolling. ScrollableBase
Slider A slider that indicates a modifiable value within a specific range. Slider
Switch A switch that can be used as a selector. Switch
Tab A tab is easy to explore and switch between different views. Tab
TableView A table view that can align child actors in a grid like layout. TableView
Text A text that renders a short text string and provides a editable text. TextLabel, TextField, TextEditor
Toast A toast is used to provide simple messages. Toast
VideoView 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. 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. For a reusable rendering logic that can be used by all UI components, take advantage of visuals.

  • Dependencies
    • Tizen 4.0 and Higher