Add a Form node (
) to create a form, which is a general user interface area for an application. It can, for example, represent the content of a desktop window, a dialog window, or a tabbed pane. A form has to be referenced by another node to be part of the user interface, but you can choose to show a form as a dialog after the user has clicked a button. To edit or test the form, use the following options on the Form node’s context menu:
) to create a form, which is a general user interface area for an application. It can, for example, represent the content of a desktop window, a dialog window, or a tabbed pane. A form has to be referenced by another node to be part of the user interface, but you can choose to show a form as a dialog after the user has clicked a button. To edit or test the form, use the following options on the Form node’s context menu:|
•
|
Right-click the Form node and choose Edit (
 ) to open the form window, where you can interactively create and design the form (see Working With Forms). |
|
•
|
Right-click the Form node and choose Preview Form (
 ) to test the form by opening it as a preview in a separate window that you can inspect. |
Enter the name of the Form object in the Name field.
The size properties are applicable when the form appears in a dialog box. By default, the Application Builder determines the initial size automatically based on the form contents. From the Initial size list, choose Automatic (the default) or Manual to specify the initial size in the Width and Height fields (default: 40 pixels).
In this section, you can adjust the form’s Horizontal and Vertical margins if desired (default: 20 pixels).
From the Store changes list, select On request (the default) to store data changes when the user clicks, for example, an OK or Apply button (and where a Cancel button can discard any pending changes), or select Immediately to store data immediately when a change is made. This setting applies when the form appears as a dialog. Use the Immediately setting to create dynamic dialogs where you, for example, have a direct connection between a slider and an input field.
To add an icon for the form when used as a dialog box (other than the default COMSOL icon), specify an image file to use from the Icon list, which includes all of the images in the Images library, or click the Add Image to Library and Use Here button (
) to locate an image to use on the file system. That image then becomes a part of the Images library and is selected as the icon for the form when used as a dialog box. The Default option loads cube.png. Click the Export button (
) to export the image to the file system (for use in another application, for example).
) to locate an image to use on the file system. That image then becomes a part of the Images library and is selected as the icon for the form when used as a dialog box. The Default option loads cube.png. Click the Export button () to export the image to the file system (for use in another application, for example).Select the Resizable check box to make it possible for users to resize the dialog if desired.
The Expandable check box is selected by default. Clear it if you do not want users to be able to expand and collapse the section. With this setting selected, you also have the option to make the section’s state initially collapsed by selecting the Initially collapsed check box.
 |
The Sketch Grid section is only available when you have selected the Sketch mode for the form.
|
In this section you find settings for the grid that you can display in the Sketch mode (see Showing Grid Lines and Snapping to the Grid) and for the snapping of form objects to that grid.
You specify the grid size by entering values in the Column width (default: 100 pixels) and Row height (default: 20 pixels) fields.
Select the Align grid to margin check box to make the grid lines align with the left and top margins.
The Snap zone slider controls how exact you need to be when resizing a form object to make it snap to the grid. By default, the snap zone is set to its maximum value so that the object quickly resizes to snap to the grid. Move the slider from Large to Small to make the snap zone smaller if desired.
Select the Snap only to grid check box to make the resizing of form objects snap only to the grid and not to the borders of other form objects, for example.
 |
The Sketch Grid section is only available when you have selected the grid mode for the form.
|
There are two tables in this section of the Settings window, one for the columns and one for the rows in the grid. In the Column and Row columns you find the column and row numbers, respectively, each starting at 1 from the left and from the top. You can control how each row and column fill up the space in the form. Each table has a Width (columns) or Height (rows) column with lists that contain the following options: Fit (the default), Grow, and Fixed.
|
•
|
The Fit option makes the column or row use the space needed for the contained object to fit. No columns or rows with the setting Fit grow.
|
|
•
|
The Grow option makes it possible for the column or row in the grid to expand by using available space in the form when a user of the application increases the size of the form by dragging the corner of the application window, for example.
|
|
•
|
The Fixed option specifies that the grid layout has a certain width or height for its column or row, specified in the third Size column of the table. For the other options, the Size column is not applicable and displays N/A. The added width or height in pixels appears in the column or row header in the form’s editing window. No columns or rows with the setting Fixed grow.
|
From the Inherit columns list, select a form object from which to inherit its column settings. The default is None; that is, the columns settings are not inherited.
|
•
|
From the Text color list, select Inherit (the default) to inherit the text color from the setting in the main Frames node, or select one of the predefined colors, such as Black. Select Custom to choose a custom text color from the color palette that opens.
|
|
•
|
From the Background color list, select Inherit (the default; the form then uses the background color from the main Forms node), or select one of the predefined colors such as White. Select Custom to choose a custom background color from the color palette that opens.
|
|
•
|
From the Background image list, choose a background image if you want to use such an image in the form. The default is None; that is, no background image is used. To add an image to the image library and use it as a background image, click the Add Image to Library and Use Here button (
 ). Click the Export button ( ) to save the background image to a PNG file. |
If you choose to use a background image, you can also specify the following alignment settings under Image position and size:
|
•
|
|
•
|
Choose Fill to automatically stretch the background image to fill the form window in the horizontal or vertical direction (or in both directions). Choose Repeat to repeat (tile) the images horizontally, vertically, or in both directions.
The default in the lists for On load and On close is None, which means that no method runs when an event is triggered for loading or closing the form. Click the Create Local Method button (
) to create a local method for On load or On close. The corresponding list selection then changes to Local method. Click the Go to Source button (
) to open the method editor window, where you can create or modify the code for the On load or On close method. Click the Remove Local Method button (
) to delete the local method.
) to create a local method for On load or On close. The corresponding list selection then changes to Local method. Click the Go to Source button () to open the method editor window, where you can create or modify the code for the On load or On close method. Click the Remove Local Method button () to delete the local method.