The Image Layer displays a bitmap image within a Layout. It is used to place visual assets such as icons, textures, or background graphics directly onto the Layout Canvas.

Image Layers have no borders by default, as the image itself drives the appearance.

This Layer can be created with the “Place Image from File” tool in the Tool Select Toolbar.

Properties #

This Layer supports all of the universal Layer properties along with some of its own.

Image #

Specifies the location of the image file to be displayed.

The “…” button beside the field opens the file browser, allowing you to select an image asset from your file system.

Important usage notes:

• The path should point to a file within the project to ensure portability and safety of your assets.
  • NOTE: If an image path becomes invalid or points outside the project, no warning will be displayed and this Layer will appear with no image.
• Most standard image formats are supported (e.g., .png, .jpg, .bmp, .gif, .tiff, .ico, .wdp).
• If your image type isn’t visible in the file browser’s default filter, switch the file type dropdown to “All Files” to locate it manually.

Stretch #

Determines how the image fits within the Layer’s bounding box. Stretch modes define whether the image is scaled, cropped, or centered relative to its defined Width and Height.

Stretch Direction

Works together with the Stretch setting to control which dimension (horizontal, vertical, or both) the image stretches along.

Opacity Mask #

This property is of the Brush Property type, which allows for color and visual styling of the Layer.

Applies a mask effect over the image’s rendered content to control how it blends or fades. This can be used to create gradient transparency, fade effects, or highlight shapes.

The opacity mask affects both Fill and Stroke uniformly, without changing geometry.

Bitmap Scaling Mode #

Bitmap Scaling Mode controls how the image looks when it’s resized. Such as when the Layer is made larger or smaller than the original image file.

This setting changes how smooth or sharp the image appears, and can also affect performance when rendering large or detailed images.

Option	What It Means	When to Use It
Unspecified	Lets the editor decide automatically. Usually gives good, balanced results.	Use this if you’re not sure which to choose — it will follow the default behavior.
Low Quality	Makes scaling faster, but the image may look a little blurry or pixelated when enlarged.	Use for simple graphics where speed is more important than appearance.
High Quality	Makes scaling smoother and clearer, preserving detail and soft edges.	Best for photos, textures, and high-resolution art where image clarity matters.
Nearest Neighbor	Keeps each pixel exactly as-is, without blending. The result looks sharp and blocky.	Perfect for pixel art, retro graphics, or any image where crisp edges are desired.

Edge Mode #

Edge Mode controls how the edges of an image look when it’s scaled, rotated, or stretched. It changes whether the edges appear smooth or sharp.

• Unspecified:
  • Uses the editor’s default behavior, which smooths out edges so the image looks clean and natural. This is best for photos, textures, and most artwork.
  • Choose if you want images to look sharp and pixel-perfect.
• Aliased:
  • Turns off edge smoothing, making edges look sharper and more pixelated. This can be useful for pixel art, icons, or stylized graphics where you want crisp, blocky edges.
  • Choose if you want images to look smooth.