ViewManager

Version 4 by Philip Breau
on Aug 15, 2014 11:23.

<< Changes from 3 to 4

compared with

Current by Philip Breau
on Aug 15, 2014 13:07.

Key

These lines were removed. This word was removed.

These lines were added. This word was added.

View page history

There are 6 changes. View first change.

		h3. viewManager
		h3. <mobi:viewManager> (as of EE 1.3.1)

		The ViewManager component makes it simple to create a responsive UI that automatically adapts to both small and large views. The ViewManager automatically constructs the UI layout structure for your application, taking care of the header, footer, menus, and submenus. The developer simply has to define the title, the views and which views should be placed in the main menu.
		The ViewManager component makes it simple to create a responsive UI that automatically adapts to both small and large views. The ViewManager automatically constructs the UI layout structure for your application, taking care of the header, menus, and submenus. The developer simply has to define the title, the views and which views should be placed in the main menu.

		The ViewManager also supports:
		* client-side view rendering for improved offline-support
		* server-side view rendering
		* view history integration, allowing the user to move back to previous views
		* animated view transitions ( horizontal or vertical slide\|fade\|flip )
		* splash screen
		* easily customizable header and menu bar styling
		* integrated Font Awesome icons
		* submenus
		* menu dividers

		[Mobile Showcase View Manager Example\|http://mobileshowcase.icesoft.org/mobileshowcase/showcase-viewmanager.jsf]

		!view-manager-small.png\|align=center!
		\\
		!view-manager-small2.png\|align=center!
		\\
		!view-manager-large.png\|align=center!

		h3. Usage


		{code:xml}
		<mobi:viewManager title="My App"
		transitionType="flip"
		barStyle="background-color: green"
		selected="#{myBean.currentView}"
		history="#{myBean.viewhistory}"
		clientSide="false">

		<!-- SPLASH SCREEN -->
		<mobi:view id="splash" splash="true" includeInMenu="false">
		<ui:include src="/WEB-INF/includes/content/splash.xhtml" />
		</mobi:view>

		<!-- VIEW MANAGER -->
		<!-- Group A Pages -->
		<mobi:view id="pageA" title="Page A" menuIcon="th-list"
		navBarGroup="viewmanager" divider="Layout and Navigation">
		navBarGroup="viewmanager" divider="Group A">
		<ui:include src="/WEB-INF/includes/pageA.xhtml" />
		</mobi:view>
		<mobi:view id="pageA1" title="Page A - 1" menuIcon="book"
		includeInMenu="false" navBarGroup="pageA">
		<ui:include src="/WEB-INF/includes/pageA1.xhtml" />
		</mobi:view>
		<mobi:view id="pageA2" title="Code" menuIcon="code"
		includeInMenu="false" navBarGroup="pageA">
		<ui:include src="/WEB-INF/includes/pageA2.xhtml">
		</mobi:view>
		</mobi:viewManager>
		{code}


		h3. Component Documentation
		[viewManager\|http://res.icesoft.org/docs/icemobile/v1_latest/jsf/tld/mobi/viewManager.html]
		[view\|http://res.icesoft.org/docs/icemobile/v1_latest/jsf/tld/mobi/view.html]