This guide explains how to use correct images in your application.
How the OS is picking right image ?
Supported Image Formats
Android and iOS supported different type of image formats. That’s why Smartface accepts .JPEG, .PNG and .BMP and .TIFF file formats only.
You can put these types of images into assets folder. Resource folders only supports .PNG type images.
Setting Correct Image
Android : For different screen sizes, the local image file is set to the resource drawable folder according to its screen size. The drawable folders can be found images/android directory. It is described more detail on Google' developer site.
iOS : There is only one resource folder on iOS devices. Different size of image file names ends with “@” prefix. It is described more detail on Apple' developer site.
How the OS manages the scaling ?
Image scaling is managed directly by Operating Systems. Just for emulator purposes, Smartface managing the images. Because of that reason, in some cases actual image size is changing for Emulator.
Using images from http(s)
Web hosted images can also be used in applications. Generally SMF.UI.Image object is used to show remote images.
How the image lookup works ?
Smartface has own image lookup mechanism. Order of image loopkup is ;
- Image paths can be assigned with just name of the file. In this case system will assume it is an image from given image.
image1.image = “a.png” —> image1.image = “images://a.png”
- If image path contains a schema, then the schema handler will handle the image path. Image path might be changed after it has been loaded (such as http download)
image1.image = “images://a.png”; image1.image = “assets://a.png”; image1.image = “ ”; image1.image = “ftp://a.png”
- For downloaded images, when loaded i.image will be replaced with full path of the stored image
- Full path lookup will be performed
Hovewer, If the setted image can not be found (not exists in path or image download fail) image will not be changed and will keep old value.
Using same images for iOS and Android
For using exactly the same image for all iOS and Android devices , assets folder can be used.
This folder is used to reach files in it directly. Instead of the “Resources” and “Images”, this folder can be reached by file operations such as read. Also, assets folder is available for each kind of device, you don’t need to use seperate folders as in Resources.
First, let's place a ".png" file inside the assets folder.
Make sure, you selected right image format for both iOS and Android. Please check formats with the "images" folder under your project folder.
After you add this image object (myicon) to the related page, it will look like below for both Android & iOS :