Xojo Documentation Xojo Documentation

When you add an image to your project (Insert ↠ Image) an Image Set is created. An Image Set provides a way for you to manage all the different sizes of an image that are needed for iOS retina screens.

The Image Set editor displays three boxes for three different image sizes: 1x, 2x and 3x. Images sized at 1x are the original image as it appears on non-Retina devices. Images sizes at 2x have double the horizontal and vertical resolution and are used on most retina devices. Images sized at 3x are triple the horizontal and vertical resolution.

To add the images, simply drag them from Finder onto the appropriate box. For best results, iOS prefers PNG images. These images are not copied to your project, but are referenced as external items. This means if you move the external files or copy the project, the images may not be found. It is often convenient to create a ProjectImages folder next to your project where you place your images files and then drag them from there.

If you drag an image file onto the Navigator, a new Image Set with the image populated at the 1x size is created.

If you do not provide images in all three sizes, iOS will scale from the images you have provided. Scaling up from 1x images results in a blurry image, so at the very least you will want to specify images in 2x sizes since most devices have 2x retina screens.

Using Images in Your Code

When you create an Image Set, you can give it a descriptive name. The Image Set in the above screen shot is named "ClockImage". To use the Image in your code, you just refer to it by its name. So to draw it in the Paint event handler of a Canvas, you would do this:

g.DrawImage(ClockImage, 0, 0)

To use the Image with an Image View control, use the Inspector to pick it from the drop-down in the Image property. Or you can assign it via code. This assigns the Image Set in an iOSImageView's Open event handler:

Me.Image = ClockImage

You do not have to worry about the specific size of the image as the appropriate one will be chosen or one will be created by scaling from what is available.