Line Widget

Use this line widget to seperate controls on the form.

Last published at: June 4th, 2024

Description:

Display a Horizontal line control on the form.

Inputs

  • ID/Name - Name of widget generated by FlowWright (read-only field)
  • Width (%) - Enter the percentage value for width
  • Height (px) - Enter the pixel value for height
  • Hide - Select the checkbox to Hide (tick mark)
  • Tool Tip - Enter information to display on mouse hover on form render
  • Styles - Enter the CSS scripts for widget styles
  • Apply Classes - Select between custom classes defined 
  • Save - Save the input values 
  • Delete - Remove this form widget from the designer page 
  • Close - Close the input popup window
 

 

Design:

 

 

Example: 

Let’s build and execute the “lineDef” example.  

  • Create a new form definition called “lineDef.” 
  • Select the Open Designer checkbox and click the “Create” button
  • Drag a Line widget to the canvas
  • Double-click on the widget to configure its “Settings” properties. Provide a name to the control. 

 

  • Double-click on the widget to configure its “Styling” properties. Provide the pixel width and height for the line. Select the check box to hide the line during run time. Provide the style script. If the class was previously uploaded, select it from the drop-down list.  

 

  • Double-click on the widget to configure its “Others” properties. Provide the tooltip text.

 

  • Click on the Save button and Close the popup window
  • Navigate to the UI menu and Preview the form. The rendered widget will display a Horizontal line control on the form.