SwiftUI on Xcode Playground vs Swift Playground - different outputs

Question

I'm running this code on Xcode Playground and Swift Playground:

import SwiftUI
import PlaygroundSupport

struct ContentView: View {
    var body: some View {
        VStack{
            ZStack {
                Color.white
                Text("hello World")
                    .foregroundColor(.black)
                
            }
            .edgesIgnoringSafeArea(.vertical)
            Circle()
                .foregroundColor(.blue)
        }
    }
}

PlaygroundPage.current.setLiveView(ContentView())

Anybody knows why we get so different outputs from the same code?

Answer 1

On the iPad, you are running in Dark Mode, and that is making the default background of the view black. Also, the iPad Swift Playgrounds provides a frame in which the view runs. This frame varies if you switch between portrait and landscape mode, but in either case it is providing a frame in which to draw.

In Playgrounds in Xcode, the view is just taking up a minimum of size.

You can get a similar look in Xcode by providing a .frame and using a Color.black background:

import SwiftUI
import PlaygroundSupport

struct ContentView: View {
    var body: some View {
        VStack{
            ZStack {
                Color.white
                Text("hello World")
                    .foregroundColor(.black)
                
            }
            .edgesIgnoringSafeArea(.vertical)
            Circle()
                .foregroundColor(.blue)
        }
        .frame(width: 500, height: 600)
        .background(Color.black)
    }
}

PlaygroundPage.current.setLiveView(ContentView())