Manipulation of Controls

1. Add

• This type of control can be added to the upper left corner of the editing area by clicking on an icon in the library.

• Hold the left mouse button over the icon, drag it to any position in the editing area and release the left mouse button, so as to add a control at this position.

• You can quickly add controls by copying and pasting those which already exist in the editing area.

  1. Select

• By clicking on the control in the editing area, you can switch between checked and unchecked states.

• By clicking on the control layer in the navigation bar, you can switch between checked and unchecked states.

• Multiple controls are selected by clicking on the control in the editing area while holding down the CTRL key.

  1. Edit

Select the widget to be edited. Customize the pattern of the widget and set the device and data flow according to the different requirements on the setting panel on which the widget appears (under multiple selection state, the last widget selected is shown).

1. Delete

When a control is selected, you can delete it by pressing the Del key or clicking on the Delete button on the toolbar.

Controls Position and Size

1. Drag/drop and change position

A control is selected by mouse-click. At this time, you can drag the control to change its position in the editing area; drag a size control point around the control to change its size.

1. Align

When more than one control is selected in the editing area, the Align button will appear in the toolbar. You can click them to align selected controls with reference to a redborder control.

1. Distribute

When more than two controls are selected in the editing area, the Distribute button will appear in the toolbar. You can click them to distribute selected controls evenly in the corresponding direction.

1. Set size via toolbar

Using a size input box in the toolbar, you can accurately control the size of the selected control. You can scale up and down by turning on “Keep Aspect Ratio”.

1. Control the stacking order of controls through layer navigation

When controls are stacked together, upper controls will cover lower controls when displayed. By dragging and dropping layers in the layer navigation, you can change the relationship between upper and lower controls.

Group and Ungroup

Multiple controls are grouped together so that they can be operated at the same time.

1. Combine selected controls into a group

By clicking on the Group button in the toolbar, the selected controls can be combined into a group.

1. Edit within a group

After selecting a group and double-clicking it, you can enter this group and edit internal controls again.

1. Back to parent group

By double-clicking on empty space in the editing area, you can exit the currently edited group and return to the parent group (if any).

1. Ungroup

After selecting a group and clicking on the Ungroup button in the toolbar, you can separate controls from the group.

Undo and redo

Currently, undo and redo support only the following operations.

• Add and delete controls.

• Change the locations and sizes of controls.

• Grouping, ungrouping and entry into and exit from group.

Preview, Save and Publish

Preview: Click “Preview” in the toolbar to preview the current editing zone in full screen. In the preview mode, only the current editing page will be displayed.

1. Save and publish: Click “Save” in the toolbar to save the currently edited application This operation will save all pages being edited.

Shortcut