Form builder

The Form Builder is a customized implementation of the form.io engine that provides a drag-and-drop form builder experience in UiPath Studio. With the Form Builder you can create forms and callouts, as well.

As an RPA Developer, you can use the new Form Builder in Studio to build complex form interfaces used only in attended automations. The form building experience consists of setting the behavior, and validation for every form component that you use.

To open the Form Builder and start building forms:

1. Open Studio.
2. Go to the Design tab, in the File group, select New > Form.
3. Name the form and save it in your Studio project.

   The form that you created opens in a separate window inside the Designer panel, and is available inside your project.

   
   

   

   
   
4. (Preview) Navigate to the Components panel, and drag your desired components into the form.

Customizing forms

After you create a new Form file, and the Form Builder opens, you can start to customize the default way you want the form to show. Use the following properties inside the Properties panel.

• Title - Change the title of the uiform file. If you don't set a specific title in the Show Form or Show Callout activity, then this title is used at runtime.
• Width - set the default width of the form in pixels. If you don't set a specific width in the Show Form or Show Callout activity, then this width is used at runtime.
• Height - set the default height of the form in pixels. If you don't set a specific height in the Show Form or Show Callout activity, then this height is used at runtime.
• Show in taskbar - select if you want the form icon to show in the taskbar at runtime.
• Show window frame - select if you want to show the window frame by default.
• Theme - choose the default theme for the form both at design time and runtime.
• Custom CSS - type CSS classes that you can apply to other form components specified by the Custom CSS Class property.

Managing form components

Check out the actions that you can perform on form components below.

Create a trigger

To create a trigger on a specific form component:

1. Select Create Trigger.

   The Create form trigger dialog opens. You can change the name or the location of the trigger workflow that you're creating.

2. Select Create to create the trigger workflow.

   The result is a new workflow named after the Property Name of the target component. The workflow contains a Form trigger activity that you can configure.

   1. Select form - select the form file based on which you create the trigger.
   2. Event - select the event for the trigger to start.

Edit

To reopen the configuration wizard, hover over the form component and select Edit.

Move

To rearrange the form components, select Move and drag the form component to another location inside your form.

Edit JSON

To edit the form component using its JSON schema:

1. Select Edit JSON.

   This opens the component's JSON schema, displaying all the default properties.

   
   

   

   
   

2. Select Full Schema to see the detailed JSON schema for the target component.

3. Edit the existent properties, or add more inside the schema.
   Tip: For a list of common JSON parameters that can be used on form components click here.

Copy and Paste

To copy a component inside the form, select Copy and then select Paste below on the same component or on another one.

Remove

To remove a component from your form, select Remove.