The Design Tab and Preview Tabs

The Form Designer in TIBCO Business Studio can have three tabs, the Design tab, the GWT Preview tab, and the Mobile Preview tab.

Each tab plays a different role:

  • The Design tab is where you model your form and configure its properties.
  • The GWT Preview tab shows how the form looks at runtime in a Google Web Toolkit (GWT) environment.
  • The Mobile Preview tab shows the URL used to navigate and preview the mobile forms on a mobile device at design time.

    TIBCO Forms uses Google Web Toolkit (GWT) as the rendering technology for forms. The GWT Preview and Mobile Preview tabs are displayed or hidden based on the active runtime environment specified in the Presentation Channel preferences. See Configuring Presentation Channels for details.

The appearance of the form in the preview tabs is determined by settings that are configured on the property sheets of the form itself, and for the panes and controls within the form.

The GWT Preview tab act as working GWT application. You can specify data in the form, press the Submit button, and see the data that would be submitted to the server at runtime.

For example, if the user specifies a new customer name and clicks Submit, the System Log panel displays information about the specified text in GWT preview, if the INFO logging is enabled. To enable INFO logging, go to Window - > Preferences - > Form Designer - > Preview. GWT log samples are as follows:

GWT: 

(-:-) 2011-08-18 11:15:49,242 [INFO ] **** Form Inout and Out Data ****
(-:-) 2011-08-18 11:15:49,242 [INFO ] { items:[{"$param":"text_field", "mode":"INOUT", "type":"STRING", "$value":"John Smith"}]}

Thus the preview tab allows you not only to evaluate the appearance of your form with the current Properties view settings, but also to test its functionality.