2D Editing Helpers

The SceneComposer offers a set of editing helpers that allow editing 2D scenes as simple and intuitive as possible.

All editing aids which have a visual presentation are configurable so that the user can disable them easily if not desired. This can be done from the dialog that opens from "File" > "Preferences" menu under the "Editor" node, the "2D" option.

In 2D scenes, SceneComposer offers the following entries in the 2D section of Editor-Preferences:

Ruler
World Transformations
Grid
Snap to Grid
Snap to Guidelines
Snap to Objects

You can also find some 2D Editing Aids in the "View" menu in section "2D Editing Utilities".

Scene Design Helpers

Rulers

Rulers provide a sense on the world space that the camera viewport bounds; display measuring points and their corresponding values (numbers).

Two rulers are drawn: one on the top of the rendering panel another on the left side of the rendering panel.
They will be drawn always having a fixed position and orientation in space.
The rulers will be attached to a 2D camera and they will always measure the space that the camera viewport bounds regardless of the camera orientation.
The rulers' starting coordinates for vertical and horizontal ruler will be the camera top-left viewport world space point.
In order to enable this editing helper, check the property "Enable Ruler" from the "Editor - 2D" section of Preferences dialog.

World Transformations

To use the World Transformations, enable this option and select an object in the Scene Editor Window. Now,a tooltip is displayed in the lower left corner of the Scene Editor that shows absolute coordinates and sizes.

The following values are displayed:

WorldPivotPosition: horizontal value, vertical value
WorldPivotPointPosition: horizontal value, vertical value
WorldPosition: horizontal value, vertical value
WorldBoundingBox: horizontal value, vertical value, width, height

Snapping

Grid

Grid represents a collection of points (1px) laid at a configurable step size for each axis (step in pixels for x or for y).

The grid is enabled by checking the checkbox "Enable" from the section Grid, in the "Preferences" > "Editor - 2D" dialog.
The steps X and Y are configurable using the slides controls "Step X" and "Step Y". Default step is 10(x)/10(y).
The grid is rendered in the background.

Snap to Grid

Snap to grid enables an object to become aligned to the grid when being translated.

Snapping is enabled for the object relative to the upper-left point of its bounding box.
To enable this feature check the checkbox "Enable" from the section "Snap To grid" and configure the desired sensitivity (the range is the distance to guideline where the object sticks to the point).

Snap to Guidelines

Snap to guidelines enables an object to be aligned to a guideline when being translated. A guideline represents a simple line, locked to a predefined world-space coordinate value.

Snapping to guidelines is configurable; it can be enabled or disabled by checking the checkbox "Snap to guidelines" from the "Preferences - Editor - 2D" dialog.
Also the snapping sensitivity - the range (distance to guideline) where the object sticks to the guideline - can be configured using the slide control "Sensitivity".

Guidelines

Guidelines are created in SceneComposer by click and drag from the ruler. In order to be removed, a guideline is dragged outside the view.
Multiple guidelines can be drawn in a scene and they are bound to a scene and not camera viewport.
The configured guidelines are visible and editable in the scene's properties.

Snap to Objects

Snap to objects enables an object to be aligned to another object's rendering area when being translated. The rendering area is the area that bounds the vertices of the bounding box of the object.

An object will be snapped to the closest other object in its proximity.
Snapping is available for RenderNodes objects only.
A render node is in the proximity of another object (thus will be snapped) if one of the four points of its bounding box is in the proximity of the rendering area of the other object (rendering area is always a not-rotated rectangle and it bounds the points of the bounding box).
The snap feature can be activated/deactivated by checking/unchecking the checkbox "Enable" from the section "Snap to objects" and the proximity range is configurable using the slide control "Sensitivity".

Positioning

Move to back/front, move back/front

This feature allows the user to manipulate objects such that they can be placed on top-most level, or sent to background. Layering is done through a property called DepthValue, in a range of 0..255.

The following operations are available:

Move back: increase depth value by 1
Move front: decrease depth value by 1
Move to back: set depth value to 255
Move to front: set depth value to 0

You can manipulate these values from the context menu, or by setting the value of property DephValue from Properties panel.

Candera 2D doesn't specify a rule for rendering objects that have the same depth value.
There might be X objects with depth value 0 (top-most), but only one object of those ones is rendered topmost.
Conflicts at the interval end (0 or 255) have to be handled.

Object alignment (top, middle, bottom, left, center, right / relative to other objects)

This feature enables automatically re-positioning of objects such that they are aligned on a specific criterion. Only render nodes and groups are eligible for alignment and this feature applies to a selection consisting of at least 2 render nodes and/or groups.

First selected object serves as reference for alignment.

The object alignment feature is available for the 2D scenes by selecting the appropriate button from the Toolbar. Each button corresponds to a criterion of alignment.

Available criteria

Top/bottom alignment: the selected objects (excluding the reference one) will be positioned such that the top/bottom side of their rendering area is aligned to the top/bottom side of the first object's rendering area.
Left/right alignment: the selected objects (excluding the reference one) will be positioned such that the left/right side of their rendering area is aligned to the left/right side of the first object's rendering area.
Center alignment: the selected objects (excluding the reference one) will be positioned such that their rendering area's geometric center is aligned to the geometric center of the first object's rendering area.
Middle alignment: the selected objects (excluding the reference one) will be positioned such that their rendering middle is aligned to the middle of the first object's rendering area

Geometric center localizer

For all selected objects (render nodes, groups, cameras) the geometric center (center = (0, 0) point in the local coordinate system) will be displayed as an image of a small dimension consisting of a circle and a dot in the center of the circle. It represents the pivoting point for rotation or translation transformation.

Three translate operations can be selected from the transformation combobox:

"PivotAndObject": moves the object and its pivot
"PivotOnly": moves only the pivot, the object remains on the same position
"ObjectOnly": moves only the object, the pivot's position remains unchanged

After choosing the "PivotOnly" option for translate mode, the pivot will move only if the user starts dragging it inside the area delimited by the borders of the object.

Groups

For grouping elements on the same level add a group to the selected objects as parent if they are on the same level. From the SceneTree panel, keep Ctrl key pressed and select more objects. On the last object that is desired to be part of the group press right click and select the option "Create group" from the context menu.