ViewManager

Added by Arturo Zambrano, last edited by Ken Fyten on Nov 13, 2014  (view change)
Table of Contents

Overview

Since 4.0

The mobi:viewManager component provides a way to display multiple views in a manner that is more suitable for mobile devices. It renders a list of titles of verious views, which the user can touch to load the corresponding view. A built-in back button allows the user to go back to the list of views, without reloading the page. The component also provides other features that make navigation more efficient on mobile devices.

Getting Started

The basic use case of the ViewManager component consists of simply placing mobi:view tags with any arbitrary content inside the mobi:viewManager tag.

<mobi:viewManager title="View Manager"
	transitionType="#{bean.transitionType}"
	selected="#{bean.selectedView}"
	history="#{bean.history}">

	<mobi:view id="view1" title="View 1">
		<h:outputText value="View 1 content..." />
	</mobi:view>
	<mobi:view id="view2" title="View 2">
		<h:outputText value="View 2 content..." />
	</mobi:view>

</mobi:viewManager>

Attributes

TagLib Documentation
This section covers attributes involved in the typical use-cases for this component. For reference, the complete taglib documentation for this component is available here.

The title in mobi:viewManager specifies the main header title.

The selected attribute stores the currently selected view. The value has to be an id of a child mobi:view component.

The transitionType attribute specifies the effect to be used when transitioning to a different view.

In the history property, the stack history will be stored (must resolve to Stack<String>).

The title in mobi:view specifies the view title in the list and in the header when such view is selected.

The navBarGroup specifies the group to which this view belongs. It's used to group related views.

The divider attribute specifies a title of a divider to insert before this view in the list and thus group different view in the list.

The menuIcon specifies the name of an icon to be used for this view in the main menu. It must correspond to a Font Awesome icon class (without the fa- prefix). Available names can be found here http://fortawesome.github.io/Font-Awesome/icons/ .

Event Listeners

None.

Client Behavior Events

None.

JavaScript API

None.

Keyboard Support

None.

Known Issues

None.

Additional Resources

External Links

Sample Applications

This component appears in the following ICEfaces sample applications:

Tutorials

This component appears in the following ICEfaces tutorials:

None
Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.

© Copyright 2021 ICEsoft Technologies Canada Corp.