Class sap.ui.ux3.NavigationBarModule: sap/ui/ux3/NavigationBar

extends Control
known direct subclasses: VerticalNavigationBar

Provides enhanced navigation capabilities and is the parent control of NavigationItem. It is displayed in the form of a horizontal line with switching markers depending on the currently selected item. The size of an item which is currently chosen by the user is enlarged. In the case that a large number of items are defined for the bar, this is made transparent to the user by showing symbols for scrolling options (forwards and backwards) to see the next or previous items.

Deprecated API:Since version 1.38. Instead, use the sap.m.IconTabBar, sap.m.TabContainer or sap.uxap.ObjectPageLayout control.

Constructor Summary
new sap.ui.ux3.NavigationBar(sId?, mSettings?)Constructor for a new NavigationBar.
Event Summary
select(oControlEvent)Event is fired when an item is selected by the user
Events borrowed from class sap.ui.core.Control
validateFieldGroup
Events borrowed from class sap.ui.base.ManagedObject
formatError, modelContextChange, parseError, validationError, validationSuccess
Method Summary
sap.ui.ux3.NavigationBar.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.ui.ux3.NavigationBar with name sClassName and enriches it with the information contained in oClassInfo.
sap.ui.ux3.NavigationBar.getMetadata()Returns a metadata object for class sap.ui.ux3.NavigationBar.
addAssociatedItem(vAssociatedItem)Adds some associatedItem into the association associatedItems.
addItem(oItem)Adds some item to the aggregation items.
attachSelect(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the select event of this sap.ui.ux3.NavigationBar.
destroyItems()Destroys all the items in the aggregation items.
detachSelect(fnFunction, oListener)Detaches event handler fnFunction from the select event of this sap.ui.ux3.NavigationBar.
fireSelect(mArguments?)Fires event select to attached listeners.
getAssociatedItems()Returns array of IDs of the elements which are the current targets of the association associatedItems.
getItems()Gets content of aggregation items.
getOverflowItemsToUpperCase()Gets current value of property overflowItemsToUpperCase.
getSelectedItem()ID of the element which is the current target of the association selectedItem, or null.
getToplevelVariant()Gets current value of property toplevelVariant.
indexOfItem(oItem)Checks for the provided sap.ui.ux3.NavigationItem in the aggregation items.
insertItem(oItem, iIndex)Inserts a item into the aggregation items.
isSelectedItemValid()Returns whether there is a selectedItem set which is actually present in the items aggregation; or, if the aggregation is empty, in the associatedItems association.
removeAllAssociatedItems()Removes all the controls in the association named associatedItems.
removeAllItems()Removes all the controls from the aggregation items.
removeAssociatedItem(vAssociatedItem)Removes an associatedItem from the association named associatedItems.
removeItem(vItem)Removes a item from the aggregation items.
setAssociatedItems(aItems)Replaces the currently associated items with the ones in the given array
setOverflowItemsToUpperCase(bOverflowItemsToUpperCase)Sets a new value for property overflowItemsToUpperCase.
setSelectedItem(oSelectedItem)Sets the associated selectedItem.
setToplevelVariant(bToplevelVariant)Sets a new value for property toplevelVariant.
Methods borrowed from class sap.ui.core.Control
addStyleClass, allowTextSelection, attachBrowserEvent, attachValidateFieldGroup, checkFieldGroupIds, clone, detachBrowserEvent, detachValidateFieldGroup, fireValidateFieldGroup, getAccessibilityInfo, getBusy, getBusyIndicatorDelay, getControlsByFieldGroupId, getFieldGroupIds, getIdForLabel, getRenderer, getVisible, hasStyleClass, invalidate, isBusy, onAfterRendering, onBeforeRendering, placeAt, removeStyleClass, rerender, setBusy, setBusyIndicatorDelay, setFieldGroupIds, setVisible, toggleStyleClass, triggerValidateFieldGroup
Methods borrowed from class sap.ui.core.Element
$, addCustomData, addDependent, addEventDelegate, applyFocusInfo, bindElement, data, destroy, destroyCustomData, destroyDependents, destroyLayoutData, destroyTooltip, enhanceAccessibilityState, exit, findElements, fireEvent, focus, getCustomData, getDependents, getDomRef, getElementBinding, getFocusDomRef, getFocusInfo, getInterface, getLayoutData, getMetadata, getTooltip, getTooltip_AsString, getTooltip_Text, indexOfCustomData, indexOfDependent, init, insertCustomData, insertDependent, prop, removeAllCustomData, removeAllDependents, removeCustomData, removeDependent, removeEventDelegate, setLayoutData, setTooltip, toString, unbindElement
Methods borrowed from class sap.ui.base.ManagedObject
addAggregation, addAssociation, applySettings, attachFormatError, attachModelContextChange, attachParseError, attachValidationError, attachValidationSuccess, bindAggregation, bindContext, bindObject, bindProperty, destroyAggregation, detachFormatError, detachModelContextChange, detachParseError, detachValidationError, detachValidationSuccess, findAggregatedObjects, fireFormatError, fireModelContextChange, fireParseError, fireValidationError, fireValidationSuccess, getAggregation, getAssociation, getBinding, getBindingContext, getBindingInfo, getBindingPath, getEventingParent, getId, getModel, getObjectBinding, getOriginInfo, getParent, getProperty, hasModel, indexOfAggregation, insertAggregation, isBound, isInvalidateSuppressed, isTreeBinding, propagateMessages, removeAggregation, removeAllAggregation, removeAllAssociation, removeAssociation, setAggregation, setAssociation, setBindingContext, setModel, setProperty, unbindAggregation, unbindContext, unbindObject, unbindProperty, validateAggregation, validateProperty
Methods borrowed from class sap.ui.base.EventProvider
attachEvent, attachEventOnce, detachEvent, hasListeners
Constructor Detail
new sap.ui.ux3.NavigationBar(sId?, mSettings?)
Constructor for a new NavigationBar.

Accepts an object literal mSettings that defines initial property values, aggregated and associated objects as well as event handlers. See sap.ui.base.ManagedObject for a general description of the syntax of the settings object.

The supported settings are:

  • Properties
  • Aggregations
    • items : sap.ui.ux3.NavigationItem[] (default)
  • Events
    • select : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]

In addition, all settings applicable to the base type sap.ui.core.Control can be used as well.

Parameters:
{string}sId? id for the new control, generated automatically if no id is given
{object}mSettings? initial settings for the new control
Deprecated:
Since version 1.38. Instead, use the sap.m.IconTabBar, sap.m.TabContainer or sap.uxap.ObjectPageLayout control.
Event Detail
select(oControlEvent)
Event is fired when an item is selected by the user
Parameters:
{sap.ui.base.Event}oControlEvent
{sap.ui.base.EventProvider}oControlEvent.getSource
{object}oControlEvent.getParameters
{string}oControlEvent.getParameters.itemId The ID of the newly selected NavigationItem.
{sap.ui.ux3.NavigationItem}oControlEvent.getParameters.item The newly selected NavigationItem.
Method Detail
sap.ui.ux3.NavigationBar.extend(sClassName, oClassInfo?, FNMetaImpl?): function
Creates a new subclass of class sap.ui.ux3.NavigationBar with name sClassName and enriches it with the information contained in oClassInfo.

oClassInfo might contain the same kind of information as described in sap.ui.core.Control.extend.

Parameters:
{string}sClassName Name of the class being created
{object}oClassInfo? Object literal with information about the class
{function}FNMetaImpl? Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata
Returns:
{function} Created class / constructor function
sap.ui.ux3.NavigationBar.getMetadata(): sap.ui.base.Metadata
Returns a metadata object for class sap.ui.ux3.NavigationBar.
Returns:
{sap.ui.base.Metadata} Metadata object describing this class
addAssociatedItem(vAssociatedItem): sap.ui.ux3.NavigationBar
Adds some associatedItem into the association associatedItems.
Parameters:
{string|sap.ui.ux3.NavigationItem}vAssociatedItem the associatedItems to add; if empty, nothing is inserted
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
addItem(oItem): sap.ui.ux3.NavigationBar
Adds some item to the aggregation items.
Parameters:
{sap.ui.ux3.NavigationItem}oItem the item to add; if empty, nothing is inserted
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
attachSelect(oData?, fnFunction, oListener?): sap.ui.ux3.NavigationBar
Attaches event handler fnFunction to the select event of this sap.ui.ux3.NavigationBar.

When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.ux3.NavigationBar itself.

Event is fired when an item is selected by the user

Parameters:
{object}oData? An application-specific payload object that will be passed to the event handler along with the event object when firing the event
{function}fnFunction The function to be called when the event occurs
{object}oListener? Context object to call the event handler with. Defaults to this sap.ui.ux3.NavigationBar itself
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
destroyItems(): sap.ui.ux3.NavigationBar
Destroys all the items in the aggregation items.
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
detachSelect(fnFunction, oListener): sap.ui.ux3.NavigationBar
Detaches event handler fnFunction from the select event of this sap.ui.ux3.NavigationBar.

The passed function and listener object must match the ones used for event registration.

Parameters:
{function}fnFunction The function to be called, when the event occurs
{object}oListener Context object on which the given function had to be called
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
fireSelect(mArguments?): boolean
Fires event select to attached listeners.

Listeners may prevent the default action of this event by using the preventDefault-method on the event object.

Expects the following event parameters:

  • itemId of type stringThe ID of the newly selected NavigationItem.
  • item of type sap.ui.ux3.NavigationItemThe newly selected NavigationItem.
Parameters:
{Map}mArguments? The arguments to pass along with the event
Returns:
{boolean} Whether or not to prevent the default action
getAssociatedItems(): sap.ui.ux3.NavigationItem[]
Returns array of IDs of the elements which are the current targets of the association associatedItems.
Returns:
{sap.ui.ux3.NavigationItem[]}
getItems(): sap.ui.ux3.NavigationItem[]
Gets content of aggregation items.

If the navigation items need to have a different parent than the NavigationBar, alternatively the associatedItems association can be used. The NavigationBar follows the approach to use the items aggregation. If this aggregation is empty, associatedItems is used.

Returns:
{sap.ui.ux3.NavigationItem[]}
getOverflowItemsToUpperCase(): boolean
Gets current value of property overflowItemsToUpperCase.

Sets the appearance of the menu items in the overflow menu to uppercase

Default value is false.

Since:
1.36
Returns:
{boolean} Value of property overflowItemsToUpperCase
getSelectedItem(): sap.ui.ux3.NavigationItem
ID of the element which is the current target of the association selectedItem, or null.
Returns:
{sap.ui.ux3.NavigationItem}
getToplevelVariant(): boolean
Gets current value of property toplevelVariant.

Defines whether the navigation bar shall have top-level appearance

Default value is false.

Returns:
{boolean} Value of property toplevelVariant
indexOfItem(oItem): int
Checks for the provided sap.ui.ux3.NavigationItem in the aggregation items. and returns its index if found or -1 otherwise.
Parameters:
{sap.ui.ux3.NavigationItem}oItem The item whose index is looked for
Returns:
{int} The index of the provided control in the aggregation if found, or -1 otherwise
insertItem(oItem, iIndex): sap.ui.ux3.NavigationBar
Inserts a item into the aggregation items.
Parameters:
{sap.ui.ux3.NavigationItem}oItem the item to insert; if empty, nothing is inserted
{int}iIndex the 0-based index the item should be inserted at; for a negative value of iIndex, the item is inserted at position 0; for a value greater than the current size of the aggregation, the item is inserted at the last position
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
isSelectedItemValid(): boolean
Returns whether there is a selectedItem set which is actually present in the items aggregation; or, if the aggregation is empty, in the associatedItems association.
Returns:
{boolean}
removeAllAssociatedItems(): sap.ui.ux3.NavigationItem[]
Removes all the controls in the association named associatedItems.
Returns:
{sap.ui.ux3.NavigationItem[]} An array of the removed elements (might be empty)
removeAllItems(): sap.ui.ux3.NavigationItem[]
Removes all the controls from the aggregation items.

Additionally, it unregisters them from the hosting UIArea.

Returns:
{sap.ui.ux3.NavigationItem[]} An array of the removed elements (might be empty)
removeAssociatedItem(vAssociatedItem): sap.ui.ux3.NavigationItem
Removes an associatedItem from the association named associatedItems.
Parameters:
{int|string|sap.ui.ux3.NavigationItem}vAssociatedItem The associatedItemto be removed or its index or ID
Returns:
{sap.ui.ux3.NavigationItem} the removed associatedItem or null
removeItem(vItem): sap.ui.ux3.NavigationItem
Removes a item from the aggregation items.
Parameters:
{int|string|sap.ui.ux3.NavigationItem}vItem The itemto remove or its index or id
Returns:
{sap.ui.ux3.NavigationItem} The removed item or null
setAssociatedItems(aItems): sap.ui.ux3.NavigationBar
Replaces the currently associated items with the ones in the given array
Parameters:
{sap.ui.ux3.NavigationItem[]}aItems The items to associate
Returns:
{sap.ui.ux3.NavigationBar}
setOverflowItemsToUpperCase(bOverflowItemsToUpperCase): sap.ui.ux3.NavigationBar
Sets a new value for property overflowItemsToUpperCase.

Sets the appearance of the menu items in the overflow menu to uppercase

When called with a value of null or undefined, the default value of the property will be restored.

Default value is false.

Parameters:
{boolean}bOverflowItemsToUpperCase New value for property overflowItemsToUpperCase
Since:
1.36
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
setSelectedItem(oSelectedItem): sap.ui.ux3.NavigationBar
Sets the associated selectedItem.
Parameters:
{sap.ui.ux3.NavigationItem}oSelectedItem Id of an element which becomes the new target of this selectedItem association; alternatively, an element instance may be given
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining
setToplevelVariant(bToplevelVariant): sap.ui.ux3.NavigationBar
Sets a new value for property toplevelVariant.

Defines whether the navigation bar shall have top-level appearance

When called with a value of null or undefined, the default value of the property will be restored.

Default value is false.

Parameters:
{boolean}bToplevelVariant New value for property toplevelVariant
Returns:
{sap.ui.ux3.NavigationBar} Reference to this in order to allow method chaining