Xcode: Markup For Playgrounds

In this post you will learn how to use markup for Playgrounds.

Hint: This post uses Xcode 8.1 and Swift 3.

Let’s start by looking at how the markup language works. Just start a new Playground and write the following lines:

Now click ‘Editor -> Show Rendered Markup’ and you’ll get this result:

markup01

You can switch back to the unrendered view by clicking ‘Editor -> Show Raw Markup’. It’s a little bit cumbersome though to use the menu for this task. It is better to add a shortcut for this operation. You can add a shortcut at ‘Xcode -> Preferences… -> Key Bindings -> Show Rendered Markup’:

markup02

All markup expressions are always inside comments, followed by “:” at the beginning of the comment:

Headers

You can use three different kinds of headers:

markup03

Internet links

Of course you can also add internet links:

This will be rendered as follows:

markup04

Playground Page links

You can not only link outside of the playground, but also to other pages within the same playground. By the way: New playground pages can be created by clicking ‘File -> New -> Playground Page’. Now, if you want link to a Playground Page that is called ‘ExamplePage’, use the following:

You can also link to the next or the previous page by using @previous  and  @next:

The order is determined by the the order of the pages inside the navigator.

Lists

You can also easily create lists:

It will be rendered like this:

markup05

You can also have different levels by using indentations:

markup07

Of course also numbered lists are possible:

markup08

Images

You can display images that are located inside the ‘Resources’ folder of your playground. You can just drag and drop the image into the playground, if the navigator is open:

markup06

Now you can display the image inside your playground:

The alternate text will be displayed, if the image cannot be loaded.

Bold and italic

It’s also possible to use bold and italic:

Resources

Title Image: @ zlikovec / shutterstock.com

Book Tip

Big Nerd Range Guide: iOS Programming: Excellent introduction to iOS development. Some programming experience is recommended.

Amazon