User Interface EditorΒΆ

How It Opens

In the Project panel, double-click the desired graphical object or click image1.

How It Appears

../../_images/03eb79d458797f53d01bb8c35c57080e7636111e.png

Part

Description

A

Path of the object being modified in a project

B

Toolbar

C

Design Area

Toolbar Buttons

Button

Function

../../_images/3372e1e9c86daec4897e45c16d5fa9700b5561bb4.png

Opens the display options for the design area.

../../_images/278dc1f28decec0b203ad75ae5cad8f69123f189.png

Moves the selected object forward or backwards on the z-axis.

image14 image15 image16 image17

Aligns the selected objects vertically or horizontally.

Note

this function increases/decreases the margins of the objects.

image18 image19

Anchors the selected items left or right maintaining margins.

image20 image21

Anchors the selected items up or down maintaining margins.

image22 image23

Anchors the selected items vertically or horizontally while keeping the selected objects in the center. It also resets margins.

image24 image25

Stretches the selected items horizontally or vertically with respect to its container.

../../_images/1749f538c40eda66796b8a466692445576f7560c2.png

Removes the selected items from the project.

Design Area Buttons

Button

Function

image28 image29

Lock/unlock child objects in the editor and show/hide them in the Project panel.

Hint

lock an object to avoid accidental changes to the objects it contains.

Design Area Viewing Options

The following options are available in this menu image30:

Button

Function

Show grid

Shows/hides the grid in the editor.

Align with the grid

Activates alignment of the object edges with the grid.

Grid size

Set the size of the grid in pixels (for further information on sizes, see Conventions on Sizes for Graphical Objects and Fonts).