Working with Controls

This topic describes how to select, position move, reorder and resize controls in forms within Flow Designer.

Selection

Controls to be added to a form in Flow Designer can be dragged from the Toolbox to the form or a container on the form. Some controls will appear in the container/form while others appear as an entry in the design space. Placement guides will appear for controls that appear in the container/form.

You can select a control from within the form with the mouse. Selection handles will appear.

Where applicable, selected controls on the form will have a Tasks menu that can be used to configure important information for the control.

Positioning

Controls can be positioned on the form using the placement guides, or moved by dragging a selected control to the required position.

Placement

To copy/cut controls in or between forms

  1. Select the controls you want to copy.
  2. Right click and select Copy or Cut from the menu (or use CTRL+C / CTRL+X)
  3. Open the destination form, if required.
  4. Right click on the destination form and select Paste from the menu.

To move controls in a form

Selected controls can be moved within a form by dragging them with the mouse. Alternatively, press the arrow keys on the keyboard to nudge the position of the selected controls Left and Right, and Up and Down. If you hold down the SHIFT key as you press the arrow keys, the selected controls will be resized, rather than moved.

Scrollbars

Use the Horizontal and Vertical scroll bars to scroll the Design Sheet.

Alignment

Alignment Guides

Horizontal and vertical alignment guides are shown on the Design Sheet as you click and drag controls with the mouse:

  • Left-to-middle:

  • Right-to-middle:

  • Top or bottom with content:

Alignment menus

Each control can be aligned individually in the form using the shortcut menu.

If you select a control and then use CTRL or Shift to select another control, or multiple controls, you can use CTRL + right-click to select the last control and use the alignment menu to align the selected controls in relation to each other. The following example shows two controls selected and the Align options enabled.

For information about specific controls, refer to Toolbox | Common Controls.