If you select or insert an image component into the Designer canvas, the ‘Image Properties’ will appear in the properties pane.
This dialog features a ‘Reset Size’ button and ‘Copy to Output’ checkbox. Click the ‘Reset Size’ button to set the width and height values to the width and height in pixels of the original image. Click the ‘Copy to Output’ checkbox if you wish the image you are inserting to be copied into the report folder. You should do this if you intend to move the report folder at a later stage.
If the ‘Auto-size?’ option is ticked, the image will rescale together with the browser window. With images, however, this may cause a loss of quality. If you would like to keep the image in its set size you should disable the auto-size option.
There is a padlock icon next to the ‘Width’ and ‘Height’ settings that can be opened and closed by clicking on it.
Closing the padlock has two results:
- Changing the width of an image will automatically adjust the height of it according to the image’s aspect ratio and vice versa.
- If the ‘Auto-size’ check box is ticked, the image will keep its aspect ratio in the dynamic report while still resizing when the browser window size changes.
Most images such as logos will benefit from having the padlock icon closed, however if you do not wish for the aspect ratio of the image to be preserved (e.g. for banners) you can simply open the padlock icon to stretch the image to the desired dimensions.
Using ‘Anchor Left’, ‘Anchor Middle’ and ‘Anchor Right’, you can define where the image is anchored in the report. For example, if you want your image to be positioned on the right hand border and unaffected by the browser window size, you would choose the ‘Anchor Right’ option.
To move the image around you can either use the X and Y fields in the ‘Properties’ tab or you can click the image in the canvas to select it and drag it to the desired location. If necessary, you can resize it by dragging the selection handles.