iOS applications are an image-driven species. When developing an app, you need icons in various sizes, Default.png images in different sizes, and also @1x and @2x images for each image file inside the app. All of these images make applications look attractive, but the downside is you have to generate these image files individually. With the introduction of the iPhone 6 and 6 Plus last week, I couldn’t help but think how difficult it will be to manage yet another group of assets: @3x assets. Fortunately, Apple has provided some great tools in Xcode 6 for managing assets. Even better, this is a way to prepare your apps for future iOS devices. One piece of this is the ability to generate Storyboard-based Launch Images in Xcode 6 and iOS 8, leaving behind the notion of individual images for each device type. Another piece of this technology is the ability to generate vector-based images from a PDF at build-time in Xcode 6. In this article, I want to delve into how you can do the latter, saving yourself time (and your sanity) in the process. Session 411 from WWDC “What’s New in Interface Builder” discussed—albeit very briefly—Xcode’s support for creating your PNG files at build time from a vectorized PDF. I share with you exactly how this is done. To begin, you’ll need a vector PDF exported from Adobe Illustrator (or your other favorite vector-based drawing tool) at the @1x size you need in your applications. This is very easily done in Illustrator by: The PDF that gets exported from Illustrator will be a scalable vector, perfectly capable of scaling to the @2x, and @3x resolutions in iOS. Let’s look at how to set this up in Xcode. In order to use this feature, you’ll need an Xcode Asset Catalog to manage your images. Don’t worry, though, you can mix standard image imports and XCAssets without issue. Follow these steps to tell Xcode to use vectors when specifying images: Next, you’ll simply use the Xcode Image Catalog image set as you would with any other image (either in code or through Interface Builder). For instance, calling --imageNamed: in code, and passing in the NSString literal name of the image set. When you build your project, Xcode will go to work, creating @1x, @2x, and @3x PNG files from the PDF that you’ve used in the Xcode Asset Catalog. For instance, if you had a @1x PDF that was 150px x 150px, then Xcode will generate the following PNG sizes for use in the application: When you run the application, iOS will automatically pick the appropriate @1x, @2x, or @3x image that Xcode generated based on the device requirements. Be sure to specify your AutoLayout constraints so that the image isn’t resized on larger devices, otherwise you’ll end up with blurry images. Xcode generates raster images that are based on the @1x PDF image instead of scaling a vector at run-time. Source.


Яндекс.Метрика Рейтинг@Mail.ru Free Web Counter
page counter
Last Modified: January 29, 2014 @ 12:00 am