Manbolo Blog

Sometimes you want to use the exact same graphical resources of the embedded Apple apps. For instance, let’s say you want reproduce the garbage button animation in the Photo app:

Yes the animation’s frame rate is not good but, but did you know that GIFs in browser supports a minimum FPS?

Or you want to use the same iBooks’ ’cream’ popovers:

Fortunately, there is an app for that, and it’s free and Open Source. UIKit-Artwork-Extractor on GitHub by Cédric Luthi extracts all the image artworks and emojis contained in UIKit. Get the source code, select a Simulator platform, build and run the app: that’s done. Note: you can try to run it on a device, but the app seems to crash because of the too large memory consumption.

Once launched, you will see this screen:

When you save the output, a folder on your desktop will be created (e.g. ~/Desktop/iPhone Simulator 6.0 artwork) that contains all the Simulator resources, organized by framework.

For instance, you will find all the garbage animation’s frames under ~/Desktop/iPhone Simulator 6.0 artwork/Shared artwork: UIButtonBarGarbageOpen0.png to UIButtonBarGarbage15.png and UIButtonBarGarbageClose0.png to UIButtonBarGarbageClose16.png.

The animated gear in the Settings apps, when installing a new OS update can be found under ~/Desktop/iPhone Simulator 6.0 artwork/Preferences app: GearAnimation0.png to GearAnimation35.png.

The ’cream’ iBooks’ UIPopover components are located under ~/Desktop/iPhone Simulator 6.0 artwork/Shared artwork: UIPopoverViewCreamBackgroundArrow*.png

The beautiful and textured Map’s signs background are under ~/Desktop/iPhone Simulator 6.0 artwork/MapsLockScreen lockbundle

There are a lot of developers that prefer to code using only Core Graphics and no png at all, but if you look at Apple’s bundles, you will see that a lot of the UIKit components are png’s based. I prefer to use png instead of coding because:

• it’s simpler,
• your graphic designer can work independently and will iterate faster,
• png on iOS is hardware decoded so performances should be really OK,
• even Apple does it (but not exclusively: Core Graphics graphics are also light and retina ready, see the Stock app’s reconstruction in WWDC 2011 Session - Practical Drawing for iOS).

Little gems

Finally, digging through UIKit will show you beautiful, unknown (by me et least!) and sometimes unused Apple images:

Have you ever seen this clumsy animated splash screen when you boot your iPhone? However, it’s here!

From jc.