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.

How to create a custom Smart Shape

Updated on September 10, 2021

Smart Shapes allow you to easily add frequently-used utilities to your process designs. Available on the Process Modeler Smart Shape palette, the standard utility Smart Shapes can be used in process flows with little to no additional configuration.

You can also take advantage of Smart Shape capabilities by designing your own shapes based on PRPC standard activity APIs. This article describes how to create your own Smart Shape and add it to the palette.

Example

In a student loan application, you can design a Smart Shape that automatically adds a history memo indicating that an applicant has finished the student loan application process after the Education Details flow action is complete.

01.png

Use the standard AddHistory activity as the basis for creating a new Add History Smart Shape: 21.png

Use the Smart Shape in your process to add the history memo:

22.png

Basic steps

To create the Smart Shape:

  1. Copy the AddHistory activity to your application.
  2. Create a post processing data transform that maps the property in the Smart Shape's flow action to the activity's parameter.
  3. Create a flow action (and its section) that captures the required parameters and displays them in the user form.
  4. Specialize a navigation record that displays the Smart Shape on the palette and defines the user interaction.

Step 1: Copy the AddHistory activity to your application

  1. Open the APIs landing page by selecting Designer Studio > Processes & Rules > Processes > APIs
  2. Click the AddHistory link to open the AddHistory activity.
    0000.png
  3. Save the activity to your application.

Step 2: Create a data transform

  1. Before creating the data transform, create a text property named .AddHistory in your application. On the General tab, specify pxTextArea in the Display and Validation area's UI Control field.
  2. Create a data transform named AddHistory in your application.
  3. On the first row, enter the following:
    • Set in the Action field.
    • param.HistoryMemo in the Target field. This is the HistoryMemo method parameter used by the AddHistory activity.
    • . AddHistory in the Source field. This is the property you created and used by the parameter.

05.png

  1. Save the data transform.

Step 3: Create a section and flow action

Create a section

  1. Create a section named AddHistory in your application.
  2. Drag and drop the Text Area control from the Basic palette onto the layout.
    05a.png
  3. Open the the control's Cell Properties panel and enter:
    • .AddHistory in the Property field.
    • History Memo in the Label field.

15.png

  1. Save the section.

Create the flow action

  1. Create a flow action named AddHistory in your application.
  2. On the Layout tab, enter AddHistory in the Section field.
    03.png
  3. On the Action tab, enter AddHistory in the Data Transform field.
    04a.png
  4. Save the flow action.
  5. Open the AddHistory activity.
  6. On the Parameters tab, enter AddHistory in the Local Action for Parameter Display field.
    16a.png
  7. Save the activity.

Step 4: Create the navigation record

  1. Open the navigation record .pyExtendedAPIs and save it to your application.
  2. On the Editor tab, double-click the first row to open the configuration dialog.
    17.png
  3. Select Selected Item in the Type field, and enter Add History in the Label field.
    18.png
  4. Add a row on the dialog's Action tab. The behavior dialog displays.
  5. In the Action section, click the Select link and select Other > Run Script.
    08.png
    The Behavior dialog refreshes and displays the Run Script options.
  6. Enter:​
    • addApi in the Function Name field.​
    • Utility and AddHistory in the Parameters fields.

09.png

  1. Click OK to exit the dialog.
  2. Click the add row icon to add another action.
  3. Select the Run Script action.
  4. In the Function Name field, enter "ViewerManager.executeAction" (include quotes).
  5. In the Parameters field, enter this value:
    script:{name:\\u0022addNode\\u0022,type:\\u0022Utility\\u0022,args:{apiName:\\u0022AddHistory\\u0022}}
    29.png
  6. Click OK to exit the dialog.
  7. Open the Options tab on the configuration dialog and enter pzAPIUpdateCaseIcon in the Icon Class field. This class is defined in the standard Styles for Editor (pyMxGraphViewerStyleDefault.css) text file.
    14a.png
  8. Open the Advanced tab on the configuration dialog. In the Show area's When field, remove the default never value and replace it with Always.
    20.png
  9. Click OK to close the dialog.
  10. Save the navigation record.

Test the Smart Shape

  1. Select the case type in the Cases Explorer.
  2. On the Case Designer's Stages & Processes tab, open the Process Outline of the Stage that contains the process you want to modify (click the Configure Process Details link under the last step beneath the Stage shape).
  3. In the outline tree, select the flow to display it in Process Modeler.
  4. On the toolbar, click 23.png to open the Flow Shape palette.
  5. Select Smart Shapes > Add History.
    25.png
    The Smart Shape displays on the layout.
  6. Position the shape between the Details assignment and End shapes.12.png
  7. Click the Adds history to case shape to open its properties panel.
  8. Enter the memo that displays in the case history after the Education Details action is processed.
    09a.png
  9. Start the process.
  10. When the EducationDetails assignments is complete, open the History tab on the work form. The memo you entered in the Add history to case Smart Shape displays, as shown below:
    000.png

Tags

Pega Platform 7.1.1 - 8.3.1 System Architect Lead System Architect Business Architect Experience Designer Case Management

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?

100% found this content useful

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