Vizlib Input Form Properties - Customization

Once you've started working with Vizlib Input Form, you may want to start applying your own styling changes. This article shows you how to use the customization functions available in Vizlib Input Form. 

TABLE OF CONTENTS

• Custom Labels
• Text Area - Multiple Rows in Single Cell
• Add-ons
• Field Tooltip Example
• Color Customization Example

Custom Labels

When you add a field to Vizlib Input Form, the field name is displayed in the table as a default, with the Display Label setting Use Field Name. When you enable the Custom setting (Figure 1) you'll be able to enter text or use an expression to create a Custom Display Label, add a Field Tooltip message, add a Suffix, set a Placeholder, set a display condition which needs to be met in Show field if, and make the field read-only with Editable if.

Note: Field Tooltip will only be displayed when the input form is in Analysis mode. 

Figure 1: Custom Display Label

You can see an example of a customized label and suffix in Figure 2. 

Figure 2: Custom Label Example

Text Area - Multiple Rows in Single Cell

When you're using the Text/Text Area data type, the Input Type settings for Text Area can support multiple rows inside in a single table cell (Figure 3).

Figure 3: Text Area Multiple Rows

When you enable Text Area settings, you can set the value of Text Area Rows (up to 50) using the slider (Figure 4). 

Figure 4: Multiple Cell Rows Setting

Back to Contents  

Add-ons

The Add-ons section of the property panel controls the Data Handling settings for the input form (Figure 5). You can choose to Include Zero Values by ticking the checkbox, and enter a Calculation condition using the editor. 

Figure 5: Add-ons

Field Tooltip Example

You can customize a field tooltip display by opening Input Fields and entering a message in Field Tooltip in the field settings. When you return to Analysis mode, you'll see the tooltip appear when you hover the cursor over the field title (Figure 6). 

Figure 6: Input Form Tooltip

Back to Contents

Color Customization Example

Vizlib Input Form has color customization options which you can use to give your table a distinctive look. Figure 7 shows an example of a "Dark Mode" input form. You can use the Custom Styling settings in the Input Fields section to customize the colors in a particular field (the example uses the Name field), or use the Appearance section to customize the colors for input form components (in this example the Main Color setting was changed).

Figure 7: Dark Mode Example

Back to Contents