The Layout View is a visual designer for your objects. It allows you to set up a pre-arranged layout of objects, such as a game level, menu or title screen. In other tools, layouts may be referred to as scenes, rooms, frames or stages. See also the manual section on layouts.
The dotted rectangle in the top left indicates the window size in the layout.
Adding, modifying and deleting objects
Double-click a space in the layout or right-click and select Insert new object to add a new object type. This will bring up the Insert New Object dialog.
To create new instances of an existing object type, another object can be control + dragged, copy and pasted, or dragged and dropped from the Project Bar or Object Bar. (Make sure you're clear on the difference between Object Types and Instances as described in Project Structure.)
A shortcut for importing image files as Sprite objects is to drag and drop image files from Windows Explorer to the Layout View. This automatically creates a new Sprite object type with the dragged image. If multiple image files are dragged, the Sprite is assigned an animation with the dragged images as animation frames.
Instances can be moved by dragging and dropping them with the mouse. Hold shift to axis-lock the drag to diagonals. Alternatively they can be nudged 1 pixel at a time with the arrow keys (hold shift to nudge 10 pixels), or co-ordinates can be typed in directly to the Properties Bar.
The Delete key or right-click Delete option deletes instances. Deleting all instances of an object does not remove the object type from the project. To entirely remove an object from the project it should be deleted via the Project Bar.
Click objects to select them. Objects cannot be selected if their layer is locked. Hold control while clicking to select multiple objects, or click and drag a selection rectangle to select all objects in an area. The Properties Bar displays properties for all currently selected objects, so changing a property sets it for every selected object.
When a single object is selected it appears with resize handles around it:
Click and drag the resize handles to stretch the object. Hold shift to proportionally resize the object. The size of the resize handles can be changed in Preferences.
Rotatable objects like Sprite also have an angle handle originating from the object's origin. This can be clicked and dragged to change the object's angle. Alternatively an angle can be entered in to the Properties Bar.
Using tilemaps
If you are designing a tile-based game, you can insert the Tilemap object and edit tiles in the Layout View. To find out more, see the manual entry on the Tilemap Bar.
Scrolling and zooming
There are three ways to scroll in the Layout View:
- The vertical and horizontal scrollbars at the edges of the view
- Hold the middle mouse button and drag the mouse
- Hold space and move the mouse (useful for laptops with track pads)
On desktop systems, middle-mouse dragging is probably the most convenient way to move around the layout.
Zooming is useful to focus on a small area or see an overview of the entire layout. There are several ways to zoom:
- The Zoom buttons on the ribbon in the View tab (hold shift while clicking to adjust the zoom amount)
- Hold control and scroll the mouse wheel. Hold both Control and Shift to zoom in integer steps (e.g. 100%, 200%, 400%...)
- + and - on the num pad (hold shift to adjust zoom amount)
The current zoom is displayed in the Status Bar. Press Control + 0 to return to 100% zoom.
Selection wrapping
If you select two or more objects, you can wrap the selection by pressing Enter or right-clicking and selecting Wrap selection. This allows you to rotate and stretch the selection as a whole.
Wrapped selections appear with a red selection box rather than blue, as shown below:
By using the red resize handles the entire arrangement can be made bigger:
The red rotate handle can also be used to rotate the entire selection around the mid-point of the selection. If you click an object while the selection is wrapped, the rotate handle moves to the clicked object's origin. This allows you to then rotate the entire selection around that object, instead of just around the mid-point.
Other
To go to the associated event sheet, press Ctrl + E or Ctrl + Tab or right-click and select Edit event sheet.
The Z order of objects within a layer can be adjusted by right-clicking and selecting Z Order - Send to top of layer or Send to bottom of layer. You can also choose Edit Z Order... to open the Z Order Bar for advanced control.
Objects can be snapped to a grid for tile placement, and the collision polygons of the displayed objects can also be outlined. The View tab of the ribbon provides these options.
The right-click menu in the layout view also provides some alignment tools under the Align sub-menu. These allow you to quickly space objects equally or align objects along their edges. When aligning, the objects are aligned to the particular object you right-clicked.
The image or animation editor can be brought up by double-clicking objects with images or animations like Tiled Background and Sprite.
Effects previewing
Effects will be displayed in the layout view if WebGL is enabled in project properties. If WebGL is disabled, the layout view will preview as it would at runtime, without displaying any effects, and using any fallbacks that have been set up.