This element displays an image (supported formats: JPG, PNG, GIF, BMP).

Source

In the drop-down menu the origin of the image is determined.

None

In the editor, a white image icon is displayed on a gray background. In the application on the local client, the element is displayed with the set border and background. The element can only be made invisible with this setting. If the element should also be hidden in the layout, it must be hidden via the display conditions.

Upload

The Select file button opens the file selection dialog of the browser. The selected file is uploaded, added to the media library and stored as an image file for the element. Once a file is uploaded and selected, the button is labeled with the file name.

Existing file in project

In the File drop-down menu, the images are displayed alphabetically by their file name. If media sharing has been allowed in another project by means of the project settings, they will also be displayed in this list under the their project title as a heading.

Predefined icon

The file selection determines the shape of the symbol. Depending on the symbol, further adjustments of the stroke and fill color as well as the stroke width are possible. Unsupported options are disabled.

Fit

To determine in which format the image is displayed within the element, there are four different options:

Fit (no cropping, possibly bars)

The Fit option fits the image into the element as well as possible. Depending on the proportions, either the height or the width of the image can be the limiting factor. This can result in parts of the element not being filled by the image ("bars" left/right or top/bottom).

Fill (can result in cropping, no bars)

The Fill option enlarges or reduces the respective image to such an extent that the element is completely filled by the image (it is covered). This can result in parts of the image being cropped and not being displayed. With this option, no "bars" appear.

Original

The Original option does not resize the image to fit the element and keeps its original size. This can result in parts of the image not being displayed, or parts of the image container not being filled, depending on whether the element is larger or smaller than the image in its original size.

Stretch (can result in distortion)

The Stretch option causes the image to be displayed in its entirety but stretched so far in height or width that the image container is completely filled. This will result in more or less distortion if the image in its original size does not exactly match the size of the element.