Overview

Rulers, guides and grids are visual tools that can aid your design efforts in Composer. They are here to help you precisely position assets and collections.

Rulers

The scene editor displays two rulers - one up top for the x-axis and one on the left for the y-axis.

The 0,0 point (based on x,y coordinates) is assigned to the upper-left corner of the scene regardless of the zoom level or scrolling. In fact, the ruler graduations will increase and decrease based upon the zoom level, becoming more spaced when zooming in and more dense when zooming out.

Guides

You can create vertical or horizontal guides by clicking either ruler. These guides extend across the entire scene and can be used to achieve very specific placement of design elements. Use the Configuration panel (explained below) to specify the guide color.

Hovering your mouse over the part of a guide located on top of a ruler causes a tool tip to display with two numbers:

• the distance, in pixels, from the previous guide if there is one or from the top/left edge of the scene
• the distance, in pixels, from the next guide if there is one or the final bottom/right edge of the scene

To move a guide, first hover your mouse over the part of the guide located on top of a ruler. Left-click and drag the small circle at the very edge of the guide or the center of the tool tip. Guide can be dragged up to but not past the edge of the scene.

For a more precise movements of the guide, click either number in the tool tip. This will cause a movement of 1 pixel in the direction specified.

To delete a guide, hover your mouse over the part of the guide located on top of a ruler and then right-click. You have the option of either deleting just this one guide or all guides.

Grids

Grids overlay the active scene with perpendicular lines spaced at a specified interval measured in pixels. You have the option of showing both Main and Secondary grid lines, where the Secondary lines subdivide the Main lines.

Use the Configuration panel (explained below) to identify which grid lines to display, what their pixel intervals should be and what color to use.

Display and configure rulers and grids

To display and configure rulers and grids, click on the configuration button in the bottom left corner of the scene editor.

This will open the configuration panel.

Magnetism

All items in a scene - all assets and collections - will snap into alignment when dragged close to any other item's center or edge as well as to any ruler or scene border. This capability is referred to as "magnetism".

Magnetism can be toggled on and off using the key combination Ctrl+m or by selecting the Composer menu item View-> Enable/Disable magnetism.