) at the right end of the Layout control group (
) and select the Panel Set control (
).
Harness form — Adding a panel set |
Note: Panel sets are deprecated.
As a best practice, upgrade panel sets to screen layouts. Screen layouts are available only to user interfaces rendered in HTML 5 document type (standards mode). You can choose from one of many different screen layout formats, each of which can be styled in the skin.
Existing panel sets continue to function, but you cannot create a new panel set in applications rendered in HTML 5 document type (standards mode). You can create new panel sets in Quirks mode.
Prior to updating a panel set, make sure that the screen layout that you select contains regions that correlate to the areas in the existing panel set.
Caution: If an existing panel set area does not correlate to a region in the screen layout, it will not be retained on upgrade.
For instance, if you want to update a Header Left Right panel set, select the Header Left Right screen layout, to ensure that all sections in the panel set display in the new screen layout.
Use a panel set to define the structure of a harness that is to be included in a composite portal. A harness can contain only one panel set. Each panel in a panel set can contain a single section. That section may hold a layout, which in turn can hold various controls or included sections.
Planning is important; determine the purpose of each panel and identify the section to be placed in each panel in advance. Select a panel set to define an overall design for the harness.
Click the down-arrow () at the right end of the Layout control group () and select the Panel Set control ().
In the pop-up list that appears, select one of the 14 design choices for the panel set, for example Top_Center_Bottom (
). Click OK.
The harness form changes to match your selected design. Each panel set has one or more panels, each identified by position as Top, Left, Right, Bottom, or Center. Each panel can contain a section.
If the SmartFrames gridlines are not visible, click 
to present the SmartFrames wireframe preview.
Caution: You can reconfigure an existing portal using the Panel Set control. Make sure that the new panel set can hold the sections in the existing set. For instance, if you convert from a Full panel set to the Header Left Right set, the section in the Bottom panel will not appear in the new set.
Click the Gear icon (
) next to the Panel Set header. Property fields may appear at the top of the panel, or in one or more tabs. If the panel is pinned (
), clickApply to apply your changes. Click the red x at the top right of the panel to close it. If the panel is not pinned, click Apply to apply your changes and continue editing, or OK to apply your changes and close the panel.
Field |
Description |
| Width | Controls the overall width of the panel set within the window. Enter a numerical value. The width at runtime is based upon value in the Unit field. For example, a width of 100 and a unit of % produces a panel set that completely fills the window. |
| Unit | Select % or px (pixels) as the unit of measure applied to the Width value. |
| Align | Select the position of the panel set in relation to the window. |
| Inline Style | Optional: Override the stylesheet settings for the panel set with local values.
Enter CSS code for an inline style. For guided assistance in composing a style definition, click the Gear icon |
To add a section to a panel, do one of the following:
) at the right end of the Layout control group (
) and select the Section control (
). Drag the control onto a panel. When the pointer changes shape to indicate that you can drop the control, release the mouse button.
to open its properties panel. Select aPurpose key part of the section in the Use Section field.Repeat for each panel in the Panel set. For details on how to add a section, see Harness and Section forms — Adding a Section. You cannot edit the section directly in the harness. Open the rule from the properties panel.
To open a harness panel's properties panel, select it and click the Gear icon .
Field |
Description |
|
Use Section |
Select or confirm the Purpose key part of the section. Click the Open icon |
| Visible When |
Optional. To control visibility of the section, enter or select one of the following:
As a best practice, use the Condition Builder to edit this field. Click ( |
|
Run on Client |
This check box appears only if the Visible When field contains a simple comparison. Cannot be used if the expression is combined with a When condition rule. Select to cause evaluation and execution of the condition each time the value of a property stated in the condition changes. If unselected, the expression is evaluated and the condition executed when the form is initially presented and whenever the form is refreshed. By default, controls that allow typing, such as Text Input, are evaluated when the user leaves the field. To re-evaluate conditions as the user types, use the Apply Conditions action with a Keyboard event. See Control Form — Completing the Control tab. |
|
Title |
Optional. Enter literal text, a reference directive, reference JSP tag, Lookup directive, or JSP tag to derive the text to appear in the left title area of a header. For example, enter {.pyLabel} or equivalently <pega:reference name=".pyLabel" /> to use the value of a property named pyLabel as a title. Note: If your application is to support users in multiple locales, choose a noun or noun phrase for the caption. When practical, choose a caption already included in a language pack, to simplify later localization. Select the Localize? box on the HTML tab. Limit title text to no more than 64 characters, even after JSP or directive tags are expanded. See About the Localization wizard. |
Options depend upon the position of the panel. The Center panel has no fields on this tab.
Field |
Description |
| Height | Top and Bottom panels only. Enter an initial height in pixels for this panel. |
| Width | Left and Right panels only. Enter an initial width in pixels for this panel. The Center panel width is determined by the width of the left and right panels, and overall width of the panel set. For example, if the Left and Right panels are 50 pixels wide, and the overall width is 200, the Center panel is 100 pixels wide. |
| Expand/Collapse | Select to allow the user to collapse this panel at runtime by clicking an expand/collapse icon. |
| User Resizable | Select to allow the user to stretch or shrink the height of this panel at runtime, by dragging a handle. |
Field |
Description |
| Refresh When | Optional. Enter a simple expression based on the comparison of a pair of constants, properties, or both, combined by Boolean operators.
As a best practice, use the Condition Builder to edit expressions. This tool also lets you trigger a refresh based on a On-Change or Add/Delete user interface actions, or specify a pre-activity and/or data transform. See Using the Condition Builder to configure dynamic form actions. |
| Using Page |
Optional. Identify the name of a clipboard page on which the properties referenced in this section are to be found. By convention, the page containing the work item is named If you leave this field blank, the Pega 7 Platform assumes that properties referenced in this expansion area are found on the primary page of the activity that displays the harness form. If, at runtime, no page with this name is found, all HTML output from this section is suppressed. If you name a page in an Applies To class that is not the harness's class inheritance path, define the name and class on the Pages & Classes tab before you save the rule. |
| View Privilege |
Optional. Identify the second key part — Privilege Name — of a privilege required to view the contents of this panel. If a user does not hold this privilege, the section does not appear. If blank, all users can view this panel. |
| Update Privilege |
Optional. Identify the second key part — Privilege Name — of a privilege required to update data in this panel. If a user does not hold this privilege, the section appears as read-only. If blank, all users can update data in this panel. |
> Open Portal>portal to open the composite portal.
to open the Style Editor. You can select from predefined lists or type a style definition directly, and preview the results.
to open or create the section. Click the 
) to open the tool. See