You define the logic of a model by adding model elements to the Design board and then defining the information flow between the elements. You add elements to a model by dragging them from the Compose task panel to the Design board. You can also add model elements by dragging out from ports of data services and other model elements that you previously added to the Design board. After you add elements to the Design board, you define the element logic and flow, and the input and output data for each element.
You can use the settings in the Options pane (Tools ®Options) to define certain aspects of Storyboard behavior that affect the way you compose a composite view. For example, you can choose whether to prevent overlapping shapes on the Design board and whether to snap model elements to the grid. For more information, see Options Pane in the Visual Composer Reference Guide.
After you have composed the composite view, you configure the composite view properties. For more information, see Configuring the Composite View.
The information in this section regarding connector and operator elements in the Compose task panel is applicable also when you create service components.
1. From the Design board, click the Compose button in the task-panel toolbar. The elements available for composing the model are displayed in the Compose task panel.
2. Drag the element(s) you require from the task panel to the Design board. For a description of each of the elements, see Introducing the Compose Task Panel.
If you are creating input to or output from data services that you have already added to the Design board, you can drag out from a port, and from the context menu choose an element. This is the recommended method for adding elements, since it automatically maps the data fields.
3. If you are using container elements that support multiple layers (for example Tabstrip, Wizard, and View Switch), add layers by clicking the Add Step icon in the relevant container. For example, you may want to add tabs to a Tabstrip container or add steps to a Wizard container. For more information, see Containers.
4. Connect the items as needed, by dragging from the relevant in or out ports to other elements, to create the logic and flow of the application. You can define input to data services, output from data services, and views that are connected through data binding (meaning that the same data is displayed in both elements). For more information about different connection types, see Connecting Model Elements.
If you drag out from an element that includes a large number of fields, the Define Data dialog box is displayed, enabling you to choose the fields for the element, and their default values. For more information, see Defining Data.
5. If you are using nested views, open the nested view component and add Signal In and Signal Out connectors so that you can transfer input and output parameters to the nested view. For more information, see Reusing Components.
6. Map the data fields from the elements used as input to the fields of a data service. For more information, see Mapping Data.
Your basic model is created, displaying the application logic. Now you are ready to configure each of the elements, as described in Configuring the Composite View.
Your model may contain data services, views, containers, operators and other model elements, as shown in the following example: