Icon Field
The Icon Field is one of the Special Fields that can be added to a form. It is similar to a radio button field in that the user must select one option from several. However, instead of a line of text, the user sees customizable icons and two lines of text for each option. This field adds a graphic element to your form and can make it easier for a user to distinguish between options available to them.
When you insert this field, it will display a couple of icons by default, just to give you an idea what it looks like and to help you get started. Use the Field Values property to change or remove these "placeholders" and customize the options and icons that will be displayed.
On This Page
Modifying Field Values
On the Field Options window, each row defines one value for the field.
Property | Details |
---|---|
Data Value | The value that gets recorded/saved in the database. |
Line 1 | The first line that is displayed on the form under the icon, in a larger bolder font. |
Line 2 | The second line that is displayed on the form under the icon, in a smaller lighter font. |
Bind Value | Optional, enter the value used in binding calculations. |
Icon | Click to select an icon from the Media Library. |
Adding an Option
On the Field Options window, click Add New Option Row to display a new blank row. Enter the values you want recorded and displayed, and click in the Icon field to select the image you want the user to see.
You can drag and drop the rows to rearrange the order in which these values are displayed to the user.
Deleting an Option
Click the red X at the end of an option row to delete it.
Customizing Icon Display Properties
The following properties provide flexible control over the display of the IconField on your form.
Property | Details |
---|---|
Color | Default is Blue. Choose from a dropdown list that includes a sample of each color. |
Icon Size | Default is Medium. Choose from Small, Medium, or Large. |
Enforce Fixed Widths | The fixed width option, when true, will force the icons to remain at the original size and not adapt to screen resizes and smaller displays. |
Icon Spacing | Controls the padding around each icon. |
0 Comments