Tutorial: Fend Off RSI with Xcode Code Snippets

Written by: on May 30, 2013

Here at Double Encore, we’re all about writing clean, reusable code.  However, sometimes we get stuck writing boilerplate that simply can’t be reduced.  Take the pragma mark.  Here’s an example:

#pragma mark - UIViewController overrides

We use pragma marks all over the place to keep our classes neat and organized (and you should, too!).  They’re important, but typing them out over and over adds up to a lot of keystrokes, and we’ve got more interesting things to write.

This is where code snippets come in handy.

Code snippets allow you to create reusable blocks of code that can easily be dropped wherever you need them.  They’ll save you precious keystrokes and time.  And, once you learn to work with them, you’ll find a bunch of opportunities to create your own and expand your code snippet library.

Creating a code snippet is easy.  First, fire up Xcode and select the code snippet library in the utilities panel.

Notice that the code snippet library already contains a few entries.

Next, type in the code out of which you’d like to create your snippet.  In this example, we’re building a code snippet for creating pragma marks.  Let’s start with “#pragma mark – UIViewController overrides”.

Click and drag across the line to select the entire block of code.

Then, click and hold over your block of code until the text cursor becomes an arrow cursor.  Drag your block of code down into the code snippet library, and then release it.

A popover will appear in which you can edit your new code snippet.

First, give the snippet a name.  Ours is “Pragma Mark”.

Then, optionally, give your snippet a completion shortcut.  Ours is “pm”.  This will allow you to simply type the completion shortcut in Xcode’s code editor to insert it into your code.  Very useful.

Next, notice that that our example pragma mark’s title is “UIViewController overrides”, but we’re going to want modify it so that we can easily enter any title.

We could do this by simply building our code snippet containing the text “#pragma mark – “.  However, there’s a better way.  By wrapping blocks of text between the “<#” and “#>” characters, our code snippet will give us completion fields into which we can insert custom text.

So, in our example, we’ll replace “UIViewController overrides”…

…with “<#Title#>”.

Also, note the completion scopes field.  We’re not going to need to modify it for this example, but it allows you to specify the scope (or scopes) in which your completion shortcut will work.

Finally, click the edit button to finish editing the snippet.  You’ll see a preview of the end result in the popover.

And we’re done.  Click the done button in the popover.  You can now delete the line of text we used to create our snippet.

Now it’s time to use your snippet!  There are two ways.  The first is to find your snippet in the code snippet library, drag it out into the code editor…

…and then release.

Once you’ve dropped your snippet into the code editor, you can press the tab key to shift the focus through your snippet’s completion fields.

The second way is to simply type the completion shortcut that you specified for the snippet into the code editor.  Ours is “pm”.

Press the return key, and your snippet will be inserted into the code editor.

Simple!  And, now that you know how to create snippets, you’ll find a lot of uses for them.  Any time you find yourself repeatedly typing out the same blocks of code, consider adding them to your code snippets library.

Here are some of the snippets I use frequently:

Chris Weathers

Chris Weathers

Chris is a lead software engineer at Possible Mobile, a high-end mobile development company. He has developed iOS apps since 2009. With a focus on front-end development, Chris has built the user interfaces for apps that have been featured on the App Store and garnered millions of downloads.

Add your voice to the discussion: