Copyright © TIBCO Software Inc. All Rights Reserved
Copyright © TIBCO Software Inc. All Rights Reserved


Chapter 2 Concepts : Mobile Forms

Mobile Forms
TIBCO Forms is designed to provide rendering suitable to the device used to access it. Mobile forms functionality of TIBCO Forms ensures optimized rendering on mobile devices. In TIBCO Forms version 2.2.0, the support is limited to the Apple iPhone and iPod touch.
You can design mobile forms by configuring the controls specifically for mobile usage. The Mobile Preview tab is provided to view mobile forms at design time: you can type the URL specified in the Mobile Preview tab in the mobile device’s web browser to access the form.
Most of the functionality available on the desktop version of forms is supported on the mobile version. However, there are some features which are not supported currently and few controls behave differently on mobile devices. The limitations are as follows:
Unsupported Functionality
The settings on the Layout tab and the Font tab in the Properties view of controls are not supported.
The settings on the Child Labels tab and the Child Layout tab in the Properties view of the pane is not supported.
The Label Visibility flag on the General tab in the Properties view of controls and panes is not supported.
The Hint field on the General tab in the Properties view of controls is not supported.
The Maximum Length and Display Length fields on the Properties tab in the Properties view for text controls are not supported.
The Pass-through control is not supported.
The Multi-select Grid panes are not supported.
Modified Functionality
Some of the panes and controls function differently when they are rendered on a mobile device. See Rendering of Mobile Forms for more details.
Working with Mobile Forms
This section explains how to enable Mobile forms, mobile specific configurations required, and the way mobile forms are rendered on mobile devices.
How to Enable Mobile Forms?
You can enable mobile forms globally within the workspace or for specific projects in your workspace.
You have to enable the Openspace Mobile channel type to activate mobile forms. To enable the Openspace Mobile channel globally within the workspace, perform the following steps:
1.
Go to Windows > Preferences > Presentation Channels.
2.
The Default Channel (Default) is displayed in the right pane.
3.
Select the Default Channel (Default) and click button.
The Presentation Channel dialog is displayed.
4.
Select the Openspace Mobile check box from the list.
5.
Click Finish.
6.
Click Project > Clean to clean the project. This will activate mobile forms.
Once mobile forms are activated, you will be able to see the Mobile Preview Tab in the editor.
You can enable the Openspace Mobile channel locally within a project by going to Context Menu > Properties > Presentation Channels > Enable project specific settings.
Previewing Mobile Forms
The Mobile Preview tab provides the URL used to navigate and preview the forms on mobile at design time. The URL is in the following format: http://<host>:<port>/forms/mobile
where:
<host> is the name or IP address of the machine on which TIBCO Business Studio is running.
<port> is the forms preview port. By default the port is 8888. To change the port, goto Window > Preferences > Forms Designer > Preview.
Type this URL in an iPhone, iPod touch, or the iPhone emulator available from Apple. This URL takes you to a page that provides a list of the projects in the workspace. You can click the required project to drill down to a list of the forms available in the selected project.
Mobile Specific Configuration of Controls and Panes
When you are designing a form for mobile devices, the following pane and control properties can be configured:
Used to specify a short label which is displayed instead of the label for the mobile rendering of the form. All controls and panes support a Short Label. To set the Short Label, go to the Mobile tab in the Properties view of the component and specify the Short Label. The Short Label can be updated via the API, bindings, or computation actions.
To set the toolbar pane, go to the Mobile tab in the Properties view of the pane and select the Toolbar check box. This toolbar pane is rendered at the top of the screen.
To set the maximum number of buttons controls go to Preferences > Form Designer > GWT Forms > Maximum mobile toolbar buttons.
Used to specify the first year that should be displayed in the date picker in mobile forms. To set the Start Year, go to the Properties tab in the Properties view of the date and datetime controls. The default value is -20.
If this is set to true, then the value of Start Year is interpreted as being relative to the current year. The value specified is added to the current year to determine the earliest year to display.
Used to specify the last year to be displayed in the date picker in mobile forms. To set the End Year, go to the Properties tab in the Properties view of the date and datetime controls. The default value is 20.
If this is set to true, then the value of End Year is interpreted as being relative to the current year. The value specified will be added to the current year in determining the latest year to display.
Used to specify the increment to use when displaying the choice for minutes in a time or datetime control. To set Minute Increment, go to the Properties tab in the Properties view of time and datetime controls. The default value is 15 and the maximum value is 60.
For example, a value of 10 will display choices of 0, 10, 20, 30, 40, 50. A value of 60 will only display 0 as a choice.
 
Rendering of Mobile Forms
A few controls behave in a different way when they are used in mobile forms and rendered on a mobile device. The differences are as follows:
Date Control
The pane that contains the date control displays the formatted date. On selecting the date, a date spinner is shown that allows you to select day, month, and year. The range of years is bounded and is configured in the Properties tab in the Properties view of the control.
Figure 71 Date Spinner
Time Control
The pane that contains the time control displays the formatted time. Selecting the time displays a time spinner that allows you to select hour and minute. The selector uses a 12 hour spinner with AM/PM.
Figure 72 Time Spinner
Datetime Control
The pane that contains the datetime control displays the formatted date and time. On selecting datetime, you go to the next screen where the date and time are displayed as two separate links. You can click on the date and time links to set them individually. Clicking the Back button will take you back to the previous screen.
Duration Control
The pane that contains the duration control displays a read-only summary of the information. Clicking on the control displays a detail screen where values can be specified for each of the fields.
Figure 73 Duration Control
Image Control
The pane containing the image control has a link for the image. Clicking on the link takes you to the next screen that displays the full image.
Optionlist Control (Single Value)
The pane that contains an Optionlist control shows the label of the selected option, clicking on which shows a choice spinner from which you can select a choice.
Figure 74 Choice Spinner
Radiogroup Control
Radiogroup controls are converted to optionlist controls in the mobile version of the form.
Textarea Control
The pane containing the textarea control displays the label. You can select the control to see the text area appear in a full screen. Selecting the Back button returns to the parent pane.
Horizontal Panes
Horizontal panes are converted to vertical panes in the mobile version of a form.
Record Panes
Record panes are used at runtime to handle both grid panes and record panes. The record pane supports all navigation functionality such as go to first, previous, nth, next, and last record. You can navigate to a specific record using the spinner control. The plus and minus icons on the navigation bar are used to add and delete records.
Figure 75 Record Panes Display
The navigation bar in a record pane displays information on which records in the record pane have validation errors.
Tabbed Panes
Tabbed panes are represented as vertical panes with each of the tabs being a nested pane. It will therefore be displayed in the UI as a list of links to the individual tabs.

Copyright © TIBCO Software Inc. All Rights Reserved
Copyright © TIBCO Software Inc. All Rights Reserved