Steps to Add icons for properties:

1. Create Binary File:

  • Create a Binary File 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. Configure Section:

  • App explorer–>Casetype–>User Interface–>Section–>Select your section you want to add Icons for fields
  • Click “Convert to full section editor”
  • Drag & drop two-column layout on section (structural–>column)
  • Add field in mail column
  • Drag & drop image property on sidebar column (Data Display–>Image)

  • Open Cell properties of image property and add icon in the image field
  • Also set width and height for icons

  • Enter “right-aligned” in CSS classes (Presentation tab–>Advanced presentation options)

Save and Run the casetype

Youtube Video: