Creating preset properties with the web UI framework

You can create present properties by using the Designer Workbench.

1. Open the Designer Workbench.
2. In the Palette or Data Sources view, right-click any item and select the Configure Presets option.
   The Configure Presets dialog box appears, with any preset properties for all of the widgets.

   Note: You can work with the presets of any customizable widget, not just the widget that you right-clicked.

   The Controls Tree view on the left side contains the widgets that have:

   • Out-of-the-box properties that you cannot change, but that you can copy to make a new widget.
   • Properties that can be customized with new presets.

   When you work with new preset properties, you can save individual presets by clicking the Save button. You can save all of the presets at once by clicking the OK button, which also closes the Configure Presets dialog box.

3. To create brand new presets for a widget, do the following:
   1. Right-click a widget in the Controls Tree view.
   2. Choose the create new preset option.

      A default name for the preset appears.

   3. Select the new preset.
   4. In the Preset Properties view, use the default name or type a new name for the preset in the Preset Name field. Click the Save button to save a new name in the Controls Tree view.
   5. To create a brand new property for a preset, type the name of the new property in the combination box adjacent to the Add button, and click the Add button. A line for this property appears in the Preset Properties view. In the Type field, you can make this new property a string value or an expression. In the Value field, enter the string value or expression. Click the Save button to immediately save this new property, or click the OK button to save all custom properties at the same time and also close the dialog box.
   6. To create a property that is based on an existing property (like maxlength or labelStyle), select that property from the combination box adjacent to the Add button, and click the Add button. A line for this property appears in the Preset Properties view. In the Type field, you can make this new property a value of its default data type (number, boolean, etc.) or an expression. In the Value field, enter a value or expression. Click the Save button to immediately save this new property, or click the OK button to save unsaved presets and their properties at the same time and also close the dialog box.
4. To create a preset for a widget that is based on another preset of that widget, do the following:
   1. Right-click a preset in the Controls Tree view.
   2. Choose the create from selected option.

      A copy of that preset is created.

   3. In the Preset Properties view, type a new name for the new preset property in the Preset Name field. Click the Save button to save the name in the Controls Tree view.
   4. To create a preset property for a brand new property, type the name of the new property in the text box with the down arrow, and click the Add button. A line for this property appears in the Preset Properties view. In the Type field, you can make this new property a string value or an expression. In the Value field, enter the string value or expression. Click the Save button to immediately save this new property, or click the OK button to save all custom properties at the same time and also close the dialog box.
   5. To create a property that is based on an existing property (like maxlength or labelStyle), select that property from the combination box adjacent to the Add button, and click the Add button. A line for this property appears in the Preset Properties view. In the Type field, you can make this new property a value of its default data type (number, boolean, etc.) or an expression. In the Value field, enter a value or expression. Click the Save button to immediately save this new property, or click the OK button to save all custom properties at the same time and also close the dialog box.
5. When you are finished, and you have not closed the Configure Presets dialog box, do one of the following to save preset changes.

   A preset can contain a number of preset properties. A preset is a holder for all the properties that a user enters. When you click the Save button, a preset is saved.

   • Click the Close button. Only presets that you have saved using the Save button will be kept.
   • Click the OK button. Any preset changes will be kept.