The icon control is deprecated. Use the auto-generated pxIcon control in new development. See Icon control.
A cell in a layout can contain a predefined icon that starts an activity when clicked. You can also add an icon to the header of a harness. Follow these instructions to add an icon to a cell or header.
Click the View propertiesicon to display the Cell Properties panel.
Your updates to this panel update the rule form upon clicking Apply. If the panel is pinned (), the wireframe on the rule form changes immediately to reflect your inputs. If the panel is not pinned (), click Apply to apply your inputs.
Field |
Description |
Type |
Select a function for this icon from the predefined values. See Built-in Types. Each has a corresponding style that determines an image, shown in the wireframe preview. Select |
Tooltip |
Optional. Enter a sentence or phrase that conveys to users the purpose and function of the icon. As a best practice, start the ToolTip text for an input field with a verb; for example "Review work item history" or "Add an attachment". If this text is to be localized. enter no more than 64 characters. Click the Open icon to review or create the field value rule supporting localization, with a middle key part of pyActionPrompt. |
Style |
Select the icon image. If you have selected a predefined icon, then in most cases — to avoid user confusion — accept the standard style that matches the value in the Type field. Two additional icons are available:
Standard icons are predefined in the standard text file rule named webwb.workform.css, an HTML style sheet. Click the Gear icon to review the style sheet that defines these icons. If necessary, your application can override the appearance of an icon by overriding the corresponding binary file rule and updating a style sheet. The selection list presents all binary file rules available to your RuleSet list with a File Name key part starting with "icon." To include a custom icon in this list:
|
Complete the General tab.
Field |
Description |
Do Action Target Window Width Window Height |
These fields appear only when the type is |
Visible |
Select to determine when the icon appears. (If this setting is not applicable, the cell contents are blank.)
|
Visible When |
If you selected
An icon that is not visible is also disabled and cannot be clicked. |
Wrap Text? |
Not meaningful for icons. |
Disable |
Specify a condition for disabling the text input:
|
Run on Client? |
This check box appears only if the Condition field contains a simple comparison. Select to cause dynamic execution of the condition each time the value of the property mentioned in the condition changes. (Mark the field containing that property as a Client Event.) Leave cleared to cause the condition to execute only once, upon initial presentation of the form. |
Complete the Advanced tab.
Width |
As a best practice, use SmartLayouts to achieve uniform width of cells throughout your application's forms. You can set the width of SmartLayout templates using the Skin rule. See Skin form — Components tab — Layouts — Smart layouts. Optional. This field appears only when the cell is not controlled by SmartLayout column restrictions. Enter a positive number for the width in pixels of this cell. (At run time, normal browser processing for rendering tables determines the actual displayed width.) You can also adjust the width this column directly:
|
Height |
As a best practice, use SmartLayouts to achieve uniform height of cells throughout your application's forms. You can set the width of SmartLayout templates using the Skin rule. See Skin form — Components tab — Layouts — Smart layouts. Optional. This field appears only when all columns in the Layout are not controlled by SmartLayout column restrictions (that is, all columns have the
|
Privilege |
Optional. Select the Privilege Name key part of a privilege rule that controls the availability of this icon at run time. During rule resolution at run time, the system uses the Applies To key part of the current rule as the first key part. At run time, the icon is not available to users who do not hold this privilege. Click the Open icon to review or create the privilege rule. |
Read-Only Style |
Optional. By default, when the user form or flow action form appears in read-only mode, the CSS style named Click the Open icon to review the text file rule that defines the style sheet. Your application can override the standard style sheet in the text file rule webwb.user_work_form.css. |
Use Header Styles |
Select to change this table cell to use header styles (by changing from <TD> elements to <TH> elements). |
Inline Style |
To apply inline styling to this cell only, type a CSS style definition in this field, or click the Gear icon to access a Style Editor window. Styles you enter in this field supplement and override style elements defined in style sheets, according to normal CSS rules. Inline styles are recorded in the generated HTML for the form; they do not alter the CSS definitions. Using the Style EditorYou can select the font, color, font size, text align, vertical align, borders, margins, and other attributes of this cell using selection lists. The Style Editor maintains a preview of the resulting presentation. If you alter the style definition directly, click Apply to update the preview. Click OK to record the style defined with the Style Editor in the panel. |
When you choose CUSTOM
as the Type value, additional fields appear on the Advanced tab.
When clicked, the custom icon executes an activity, using parameter values determined in this panel or parameter values determined by user input.
Field |
Description |
Do Action |
Select an activity to execute when users click the custom icon. To find the activity at run time, the system uses the Applies To key part of this rule as the initial Applies To key part of the activity. |
Parameters |
If the activity selected accepts input parameters, you can specify sources for the parameter values here, or allow users to enter them at run time. To define parameter values on the panel, enter a constant value, a property reference, or expression for each parameter. |
Pass Current Parameters |
Select to share the parameter page of the current activity with the called activity. |
params |
If the activity accepts input parameters, enter constant values for each required parameter. |
(no label) |
Select one:
|
No Data Submission |
If you selected |
Target Name |
If you selected |
Window Width |
If you selected |
Window Height |
If you selected |
Icons listed in the following table support standard activities. You can override the activity or the ToolTip text.
To avoid user confusion, do not use a standard icon for a processing function that is unrelated to its default function.
Type |
Icon Style and Description |
Add New Work
|
|
Attachments
|
|
Cancel
|
|
Contents
|
|
Enable Action Section
|
|
Expand/Collapse
|
|
Explore
|
|
Finish Assignment
|
|
Get Next Work
|
|
History
|
|
Local Action
|
|
Reopen Work Item
|
|
Review
|
|
Save
|
|
Show Reopen Screen
|
|
Show Flow Location
|
If the harness is a New harness — one supporting the entry of new work items — do not include the |
Spell Checker
|
|
Update
|
This capability is not desirable in all applications, as it allows users to overwrite values entered previously, perhaps by other users. The Apply button sends changed user inputs to the server, but does not commit these changes. The user must select and complete a flow action to save the changes. See Understanding transactions in flow executions. |