Navigation Bar

The navigation bar 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, you can move to the target page.

Note
This component is supported since Tizen 2.3.

Table of Contents

  1. Default Selector
  2. HTML Examples
  3. Methods

Default Selector

Make the navigation component with the data-role="navigation" attribute. For semantic understanding, use the nav element.

<div data-role="page">
   <div data-role="header" data-position="fixed">
      <h1>title</h1>
      <nav data-role="navigation" id="navigation"></nav>
   </div>
   <div data-role="content"></div>
</div>

HTML Examples

To create a navigation bar, an array containing the navigation history is required. Each value of the array must have an identifiable value, such as a name. In the following example, the array is named as "historyArraytoUse".

The navigation bar component only provides the creation of the visual navigation bar, no functional navigation. You must separately implement the navigational function in the application using other methods, such as history.go().

Methods

Summary

Method Description
create ( Array navigationHistory ) 

Initiates the making of the navigation bar.

create

Initiates the making of the navigation bar.

create ( Array navigationHistory) 

Parameters:

Parameter Type Required/optional Default value Description
navigationHistory Array Required

Return value:

No return value