Mobile UI Components
The Web UI Framework (called as TAU; Tizen Advanced UI framework) provides rich Tizen components that are optimized for the Tizen Web browser.
UI components list
The following table displays the components provided by the Tizen mobile Web UI Framework.
| UI component | Description | Version (Since) |
|---|---|---|
| Button | Button component changes the default browser buttons to special buttons with additional features, such as icons, corners, and shadows. | 2.0 |
| Checkbox | Checkbox component changes the default browser checkboxes to a form more adapted to the mobile environment. | 2.4 |
| Colored List View | Colored list view provides the list has gradient background color. | 2.4 |
| Dimmer | Shows the value that can be identified with intensity of widget color. | |
| Drawer | Drawer component allows you to open and close a drawer to show or hide the content inside it. | 2.3 |
| Dropdown Menu | Dropdown menu component is used to select one option. It is created as a drop-down list form. | 2.4 |
| Expandable | Expandable component allows you to expand or collapse content when tapped. | 2.4 |
| Floating Actions | Floating actions component creates a floating button at the bottom of the screen. | 2.4 |
| Grid View | Grid View components provides a list of grid-type and presents contents that are easily identified as images. | 2.4 |
| Index Scrollbar | Index scrollbar component shows a shortcut list that is bound to its parent scroll bar and list view. | 2.4 |
| List View | List view component is used to display, for example, navigation data, results, and data entries, in a list format. | 2.0 |
| Navigation | Navigation component is used inside the header to navigate back and forth according to the navigational history array, which is created by the application. By clicking a horizontally-listed element on the navigation bar, the user can move to the target page. | 2.3 |
| Page Indicator | PageIndicator component presents as a dot-typed indicator. | 2.4 |
| Panel Changer | Panel changer and panel component provide multi page layout in a page component. | 2.4 |
| Popup | Popup component supports 2 pop-ups: the position-to-window pop-up (like a system pop-up), and the context pop-up. | 2.0 |
| Progress | Progress component shows that an operation is in progress. | 2.0 |
| Radio | Radio component changes the default browser radio button to a form more adapted to the mobile environment. | 2.4 |
| Search Input | Search input component is used to search for page content. | 2.4 |
| Section Changer | Section changer component provides an application architecture, which has multiple sections on one page. | 2.4 |
| Slider | Slider component changes the range-type browser input to sliders. | 2.0 |
| Tabs | Tabs component shows an unordered list of buttons on the screen wrapped together in a single group. | 2.4 |
| Text Enveloper | Text enveloper component changes a text item to a button. | 2.4 |
| Text Input | TextInput component is decorator for input elements. | 2.0 |
| Toggle Switch | Toggle switch component is a common UI element used for binary on/off or true/false data input. | 2.0 |
Deprecated UI components
The following table displays the components are deprecated by TAU.
| UI component | Description |
|---|---|
| Autodividers | Autodividers component extension automatically creates dividers for a list view component. |
| Checkbox Radio | Checkbox radio component changes the default browser checkboxes and radio buttons to a form more adapted to the mobile environment. |
| Collapsible | Collapsible component allows you to expand or collapse content when tapped. |
| Control Group | Control group component improves the styling of multiple buttons by grouping them into a single block. |
| Date-time Picker | Date-time picker component shows a control that the user can use to enter date and time values. |
| Fast Scroll | Fast scroll component shows a shortcut list that is bound to its parent scroll bar and respective list view. |
| Gallery | Gallery component shows images in a gallery on the screen. |
| List Divider | List divider component creates a list separator, which can be used for grouping list items. |
| Multimedia View | Multimedia view component displays the audio and video player. |
| Notification | Notification component shows a pop-up on the screen to provide notifications. |
| Progress Bar | Progress bar component shows a control that indicates the progress percentage of an on-going operation. |
| Scroll Handler | Scroll Handler component is an extension for the scroll view component, and adds a scroll button that looks like a handle. |
| Search Bar | Search bar component is used to search for page content. |
| Select Menu | Select menu component is used to select one option. It is created as a drop-down list form. |
| Swipe | Swipe component shows a list view on the screen where the list items can be swiped vertically to show a menu. |
| Tab Bar | Tab bar component shows an unordered list of buttons on the screen wrapped together in a single group. |
| Token Text Area | Token text area component changes a text item to a button. |