Creating Mobile Applications

To create a new mobile application or to provide a mobile version of your existing seaBreeze application, add a new application from the seaBreeze Browser.

In the Application Wizard, choose the platform Mobile.

ApplicationWizard-Mobile.png

In the example, the same namespace and package is used as in the previous example where the Desktop version of Project92 was created. The template that is selected per default is the Standard template. The standard template automatically creates the following html structure:

EmptyMobileApplication.png

It adds a Form to the document and in there it adds the header, content and footer elements. The form is required for all input fields anyway and the other three elements are typically used in mobile applications. The Header Bar typically shows a label of the current page. The footer bar typically shows actions that the user can perform in the current context. Both bars always stay at the same position on the screen and don't move when the user scrolls. The contents element contains all the elements that are shown in the main part of the page.

Project92-Mobile.png

The screenshot shows the Project92 Mobile application on an iPhone in Safari. The button at the bottom is a Link with an icon and a text. The header bar contains a H1 header with the text Project92. The address-bar is automatically hidden in jQuery Mobile apps and the navigation bar at the bottom always shows the back and forward button, which should be kept in mind during development. Typical mobile applications always provide a way to navigate back in the list, but mobile web-applications don't need that because the browser already provides back and forward buttons.

 

 

Copyright 2013 by Georg Heeg eK, released under MIT License