Pages

Monday 17 November 2014

Asset Catalogue in Xcode

Apple introduced a new concept called "Asset Catalogue" with the XCode5. It is even better with the latest XCode. 

Asset Catalogue

Asset Catalogue is the collection of all the icons, app images, launch images of your application. When creating a new project in Xcode 5 (or later version), the asset catalogue will be automatically created for you. We can add the asset catalogue for the older projects too. The Xcode asks a confirmation to add the Asset Catalogue while converting older projects to the latest Xcode.

Advantages of Asset Catalogue:
1) All the icons, splash images are listed under a single hood. You can easily spot the missed images.
2) You don't need to follow the naming conversion when using 2 images for the normal and retina(@2x) displays.
3) However, if you have two images like button_bg.png, button_bg@2x.png and if you drag them into the asset catalogue, the XCode will automatically identify that the two images are the two version of a single image. So XCode will group them into a single asset called "button_bg". You can use this image simply by passing "image" to the [UIImage:imageNamed:@"button_bg"] method.
4) We can use patch images like Android. Previously we have to do all these in code by the resizableimagewithcapinsets method. Now we can do this in Xcode by Slicing.

Even if you have device specific images (separate images for iPad) you can select them in the file inspector of the asset.

Device Specific Images


Slicing Images:
Resizing images using slicing is a common technique for creating visual elements such as buttons - where the center of the image should be stretched or tiled to the new size, and the corners should remain the same size.
When adding a new image to the Asset Catalogue of the Xcode project, you can do your slicing by clicking the "Show Slicing" button. This will give you the options to slice horizontally/vertically/both. You can select according to the image.

You have to adjust the slicing according to your image. According to your image you can select the slicing options in the preview pane. You can edit the values manually in the file inspector also.




The main advantage of the slicing is we can use patched images instead of using a big image. This will help us to reduce the size of the application.
Also when using the asset catalogue, the Xcode converts them into a binary format which increases the speed of our app.

Have a look at the following images, which shows the magic of slicing.


Before Slicing
After Slicing


Apple Docs link is here.

No comments:

Post a Comment