Using the Form builder

The Form builder allows you to create a custom layout for the form of a template.

Setup

1. Click "Create custom form" in the Form preview panel

   • A custom form is created based on the auto-form

   • Each input widget is already linked to its target property

   • Form builder is entered in Edit mode

Edit form layout

1. If you are not already in Edit mode, click the "Edit" button in the top left corner

The Edit mode shows

• on the left side the following draggable options

  • a list of available target properties

  • a list of available widgets

• on the right side

  • an Outliner - gives an overview of the current form and lets you select widgets

  • an Inspector - shows the settings of the selected widgets and allows changing them

Form width behavior

How the form behaves in the panel depends on how you structure the root level of your layout.

Single Container on root level	More than one widget on root level
Form is responsive Width: Scaled to fill the panel, adapting as the panel resizes. Height: Content scrolls inside the container	Form is NOT responsive Width: Not scaled, widgets keep their canvas widths, positions and height. Height: The form scrolls in the panel

Move a widget

1. Click and drag the header of the widget to move it to a different position

Add a new widget

1. Drag a widget

   • from the left side menu

   • OR directly from the Template properties panel

2. Drop it onto a container or the canvas

   • Use the drop indicator to specify where to insert it

Link a target property

If the input widget is not yet linked, or the target has to be updated

1. Select the widget to set/change the target for

2. Change the target property using the dropdown in the Inspector

Swap a widget

1. Click the Swap icon on the widget
   OR click the Widget type dropdown in the Inspector

2. Select a widget type from the list

Delete or duplicate a widget

1. Click the Delete or Duplicate icon on the widget

Edit form widget properties

1. Select a widget on the canvas or in the Outliner

2. Edit the properties in the Inspector panel

Edit multiple widgets simultaneously

1. On the Canvas or the Outliner Ctrl + Click (or Shift + Click a range - Outliner only) the widgets you want to edit

   • The Inspector shows the properties common to the selected widgets

Preview form

1. Click Preview in the top left corner of the Form preview panel

This shows the form as an operator will see it. Click Edit to return to editing.

Revert to auto-form

1. Click the Overflow icon on the top right of the Form preview panel

2. Select Revert to auto-form

Available widgets

Layout widgets

Container

Groups widgets and controls their layout. Nest them to build more complex layouts.

Widgets are arranged "flexbox-like” in columns. Default column count is set to 1, which arranges the widgets vertically. The height of the Container depends on Form width behaviour (see above).

Create a 2 column layout:

1. Select the container

2. Set Columns to 2 in the Inspector

Span a container over multiple columns

1. Select the container

2. Set Spans, for example to 2, in the Inspector

Bottom container spans 1 column	Bottom container spans 2 columns

Use Gap, Padding and Background color for styling.

Heading

Adds a heading to label a section of the form

Divider

Adds a horizontal line between sections

Input widgets

These widgets are bound to a template property and are used to control the graphic: