iOS Playground doesn't show UI preview

Question

I've created a simple playground with XCode 7.1 and I've typed this simple code:

import UIKit 
import XCPlayground 

var str = "Hello, playground" 

let color = UIColor (red: 1 , green: 1 , blue: 0 , alpha: 0 ) 

let view = UIView() 
view.backgroundColor = UIColo (colorLiteralRed: 1 , green: 0 , blue: 0 , alpha: 0 ) 

view.frame = CGRect (x: 0 ,y: 0 ,width: 100 ,height: 100 ) 

let label = UILabel (frame: CGRect (x: 5 , y: 5 , width: 50 , height: 20 )) 

label.text = str 

view.addSubview(label) 

When the playground runs, it doesn't show UIKit object preview, but only debug information:

What am I doing wrong?

Solution 1

Open the preview panel: View > Assistant Editor > Show Assistant Editor

Then in your code:

import PlaygroundSupport
PlaygroundPage.current.liveView = view

Don't forget to give your view a visible frame.

---

Ps: after Xcode 9, you can create a playground with default view

Solution 2

The accepted answer is a screen-shot, not in-line code, and it shows how to do this pre Xcode 8, so I don't think it's a good answer.

Here is an updated answer For Xcode 8:

There are several steps:

You need to import PlaygroundSupport

import PlaygroundSupport

You need to set PlaygroundPage.current.needsIndefiniteExecution to true:

PlaygroundPage.current.needsIndefiniteExecution = true

You need to add the view hierarchy you want to display to the liveView:

PlaygroundPage.current.liveView = container

The whole playground might look like this:

import UIKit
import PlaygroundSupport

let container = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
let view = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
view.backgroundColor = UIColor.red
container.addSubview(view)

PlaygroundPage.current.liveView = container
PlaygroundPage.current.needsIndefiniteExecution = true

Finally, you need to see the live view you just created. On my copy of Xcode 8 (release version) If I try to select view menu>assistant editor>Show Assistant Editor Xcode crashes, every time.

I have to hover my mouse on the right side of the screen in the box to the right of the code, on the line where I create the container view. I see a little eye icon, and if I click on that, it shows the live view without crashing.

Solution 3

For those of you who experience the problem that the assistant editor doesn't do anything (for me it was simply blank), here is how I solved the problem.

1. Use that code to test: https://stackoverflow.com/a/33543820/4572536 (accepted answer from above)

2. View -> Assistent Editor -> Assistent Editors on Bottom (or any other option)

The latter will trigger Xcode to redraw the view.

Note: I'm sharing this as a possible workaround, because for me my Xcode didn't draw the view even after full system restarts. I have no idea how to reproduce that issue, but if you happen to bump into it you can try this workaround.

Solution 4

Besides syntax, I found an other trick to bring live view back to display in my case(Xcode 8.2.1 Swift 3.0). Also this might a minor bug in Xcode. Just click the + button at the top of assistant editor. Because sometime your assistant editor is showing the interface file of your file and refuse to automatically show live page.

Solution 5

After creating Xcode playground for a single view and running it for the first time, don't forget to activate Assistant Editor in the right upper corner to enable Live View.

View more solutions