To add new control items to a page, simply select which control you would like to add then drag and release on the page where you would like the control to be. You can add buttons, sliders, colour pickers, labels, keypads and clocks.
To edit controls that are already on the page, click and then select the controls you would like to edit. You can now edit the controls by using your mouse to move and resize the controls or move the controls by pressing the arrow keys on your keyboard.
You can delete controls by selecting the controls and then clicking .
With multiple controls selected you can use a variety of tools to alter their layout:
Icon: |
Layout control: | Effect: |
![]() |
Layout selected controls horizontally | Moves and resizes the selected controls to fill the selection box with spacing between controls dictated by the spacing value. Controls will be laid out horizontally. |
![]() |
Layout selected controls vertically |
Moves and resizes the selected controls to fill the selection box with spacing between controls dictated by the spacing value. Controls will be laid out vertically. |
![]() |
Layout selected controls in a grid | Moves and resizes the selected controls to fill the selection box with spacing between controls dictated by the spacing value. Controls will be laid out in a grid. This grid layout supports controls that span multiple rows or columns. |
![]() |
Align selected controls to the left | Moves the controls to the left-most point of the selection box.Does not effect the Y axis or control size. |
![]() |
Align selected controls to the right | Moves the controls to the right-most point of the selection box.Does not effect the Y axis or control size. |
![]() |
Align selected controls to the top | Moves the controls to the top of the selection box.Does not effect the X axis or control size. |
![]() |
Align selected controls to the bottom | Moves the controls to the bottom of the selection box.Does not effect the X axis or control size. |
![]() |
Align selected controls to the middle in a vertical line | Moves the controls to the centre of the selection box in a vertical line.Does not effect the Y axis or control size. |
![]() |
Align selected controls to the middle in a horizontal line | Moves the controls to the centre of the selection box in a horizontal line.Does not effect the X axis or control size. |