Method for Interpreting Illustrator Art Assets as Cocoa CGPathRef

In the creation of Lens•Lab, we had to figure out a way to create an art asset that contained visual detail that would scale from 10cm to 100m. we know Adobe Illustrator very well so we were hoping we could create the art asset there. The problem was this: we had to take this path in Illustrator and scale it programmatically in realtime over 4 orders of magnitude.

The solution we came up with is an Objective-C method that parses a specially prepared chunk of an Illustrator EPS file and creates a Cocoa CGPathRef object which one can then manipulate to one’s heart’s content.

Step 1: create your path in Illustrator. Since this is going to end up as a CGPathRef object, we won’t be getting any color or stroke data from Illustrator. So basically, limit yourself to one single shape (compound paths are fine), fill it with black, and then you’re done. Oh, and you have to flip it vertically because of differences in coordinate systems between Illustrator and Core Graphics. Save this artwork as an Illustrator 3 EPS with no preview.

Step 2: Open this EPS in your favorite text editor. Find the chunk between %%EndSetup and %%PageTrailer. Copy and paste this into either an NSString or a text file for reading in later.

Step 3: In your code,

#include “ShapeUtilities.h”

and call

CGPathRef yourPath = [ShapeUtilities createCGPathRefFromEPSString:yourString];

Oh look! I made you a zip archive with an Xcode 4 iPhone project all set up! And here’s what it looks like!

I’m sure this class could be extended to do much better (read: any) error checking and I suppose you could even try to parse appearance stuff as well. Perhaps even wrap up the CGPathRefs in an array if there are multiple shapes. Just go for it!

About these ads

9 Responses to Method for Interpreting Illustrator Art Assets as Cocoa CGPathRef

  1. [...] The tutorial is from Jeff Menter and it can be found along with the sample code here: Method for Interpreting Illustrator Art Assets as Cocoa CGPathRef [...]

  2. [...] The tutorial is from Jeff Menter and it can be found along with the sample code here: Method for Interpreting Illustrator Art Assets as Cocoa CGPathRef [...]

  3. [...] an Illustrator eps file and convert it to CGPath. Guess I’ll have to try that out now too! Method for Interpreting Illustrator Art Assets as Cocoa CGPathRef Share this:TwitterFacebookLike this:LikeBe the first to like this [...]

  4. shannoga says:

    Great classes.
    Is there a way to get a path with out a fill with this method ?
    Thanks
    Shani

  5. Eric says:

    Thanks for this. Did you use an EPS command reference that also describes the abbreviated commands used? If you did, maybe you could add a link to your post. I’d like to extend your code but can’t for the life of me find a usable reference.

    A shape I prepared contains a single “b” command (no idea what this does) in the final line. Your createCGPathRefFromEPSString: method does not handle this and simply leaving it off or replacing it with a “f” (close subpath) does not work.

  6. Dömötör Gulyás says:

    Hi Jeff,

    I’ve created a hopefully slightly more robust impl, inspired by your code: https://github.com/dognotdog/giddy-machinist/blob/master/source/ShapeUtilities.m

    It is able to read simple .eps files directly coming out of illustrator, at least.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: