Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

This content has been archived and is no longer being updated.

Links may not function; however, this content may be relevant to outdated versions of the product.

Section preview shows changes in real time for templated sections

Updated on February 14, 2019

In Designer Studio, you can create a section by using a design template on the Design tab of the Section form. As you build the templated section, the section preview shows the effects of your changes as you add, move, or delete elements, resize the section, switch to a different design template, or modify the application skin. By previewing the runtime appearance of your section as you create it, you save rework and development time.

Regions in templated sections

A design template contains one or more regions, which are marked with the letters A, B, C, and so on, or with names that you give them to indicate their purpose. The section preview on the left of the Design tab and the corresponding template element list on the right use the same names or letters, to help you see the relationship to the regions in the design template. In the following example of a section based on the 2 Column design template, region A is highlighted:

regions-on-templated-section.png

Regions on the section preview, design template, and template element list

Changes are reflected as you make them

As you add or remove elements—fields, controls, and embedded sections—the section preview and the template element list both reflect your additions and deletions. For example, you can add fields and options for collecting expense report information in regions A and B, as shown in the following figure. The Eye icon beside the Phone number field in the template element list indicates that a visibility condition has been set. The field is always visible in the section preview.

eye-icon-indicates-a-visibility-condition.png

Visibility icon in the template element list

If you switch to a different design template or resize the display area, elements are automatically rearranged in the section preview. Working in the section preview, you can add or remove elements, move elements within a region or across regions, or modify the properties of any element. Modifications to the application skin are also reflected in the section preview. In the following example, the design template has been changed, the Employee Organization field has been dragged to a new location, the Client Company field has been resized and dragged to region B, more elements have been added, and the screen has been resized by dragging the divider between the section preview and the template element list.

section-preview-example

Screen preview example with two regions

Design templates and rulesets

When you update a design template, any section that uses that design template is automatically rebuilt when you generate the application. Similarly, when you switch the design template on which a section is based, the section is automatically rebuilt to reflect the new template. Design templates, like other rules, are governed by their rulesets. To ensure that the design template modifications are accurately reflected during the development process, follow these guidelines:

  • If a design template is in a branch ruleset, ensure that the sections that use the design template are in a branch ruleset in the same application.
  • If a design template is in an application ruleset, the design template can be used by sections in the application ruleset or in branch rulesets of the same application.
  • If a design template includes other rules, such as binary files or sections from branch rulesets, you cannot switch to the design template if you are working with a section that is in the application ruleset and that you created in Pega Express. If you attempt to do so, you will not be able to use the asset (binary file or section) from the branch ruleset.
  • If a design template for a section is in a private ruleset, you cannot switch the section to use a different design template.

Procedure

For a step-by-step explanation of how to work with the section preview, see Creating a section based on a design template.

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best.

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us