Skip to main content

Graphical Shapes

Graphical shapes are lightweight components that allow the customization of input or output fields within complex components. By attaching a graphical shape to a field, developers can tailor its appearance, enhancing how the field is presented to the user.

They are typically defined in layout files (.lay) within the Cmp attribute, but they can also be defined in prototypes in the same manner.

The primary components that can be associated with graphical shapes include: INP, FLD, MAT, EXU, and BOX.

Example

Applying a Checkbox Graphical Shape to Box and INP Components

Let's consider an example of a checkbox graphical shape applied to a BOX component and an INP component.

  1. Define the Graphical Shape in a Layout File

    In a .lay file, specify the desired graphical shape aligned with the column name of your component, also indicating the Ogg type of the column's data.

    :Sez Pos="A"
    ::Fld Nam="CHK_01" Txt="Checkboxe Description" Ogg="V2SI/NO" Cmp="Chk"

  2. Reference the Layout in the Scheda Setup

    In your scheda, reference the layout in the setup of each respective component.

    ::G.SEZ Pos(1)
    ::G.SUB.INP Tit="*NONE"
    ::G.SET.INP Layout="layout_filename"
    ::D.FUN.STD <retrieve-data-fun>

    ::G.SEZ Pos(2)
    ::G.SUB.BOX Tit="*NONE"
    ::G.SET.BOX Layout="layout_filename"
    ::D.FUN.STD <retrieve-data-fun>

Checkboxes will be rendered as a result.

Graphical Shape Attributes​

Graphical shapes can include properties that enable more specific customizations. For example, you can set the dimensions for an image-type graphical shape or specify the date format for a calendar-type graphical shape.

These properties should be listed within the Ext attribute in the format property_name(value), defined in the layout file corresponding to the specific field, rather than within the scheda where the component is defined.

Example

Image Graphical Shape with Width and Height Attributes Defined in Layout

::Sez Pos="A"
::Fld Nam="IMAGE" Txt="Image Description" Cmp="Img" Ext="ImgWdt(50) ImgHgt(50)"