Pega Platform™ allows you to customize the look and feel of your application by providing the ability to include your own logo, display an image on a button or link control, use custom sprites in the UI design, and determine what the user sees during a guardrail warning. To use custom icons or images to your Pega Platform application, you first need to add your binary file to the Image Library. To do this, create a Binary File rule to store your icon or image to the Pega Platform Image Library
Steps to Adding a Binary File:
1. Create a Binary File rule
- Create a Binary File rule in Designer Studio by selecting +Create > Technical > Binary File
- Binary File record configuration:
Label | The Binary File rule label and identifier |
App Name | The directory where the image is stored |
File Type | The binary file extension (do not include a period “.”) |
- Click Create and Open
- Click Upload File to open the file browser.
- Browse for an image of the type specified in the New/Save as form, and then click Upload File.
- If the file is treated as a sprite, select the check box, and then enter the icon width and height.
- Click Save
- When the file save is successful, the image that was imported & added to the Image Library is displayed
2.Find your image in the Image Library
- After the image has been successfully uploaded and saved, you can find it in the Image Library.
- Open the Image Library by selecting Dev Studio > Technical > User Interface > Image Library.
- Search for the image by rule name or image (label) name
3.Configure Section:
- Go to Section (App explorer–>Casetype–>User Interface–>Section)
- Drag & drop image field into the layout (Data Display–>Image)
- In cell properties panel, Select Icon source as Image
- Enter the binary file name in the Image field
- Enter width & height of Image in the Image size field
- Save and Run the Casetype
Youtube Video: