Preview without any device drawn around it

Question

Created Mar ’23

Replies 2

Boosts 0

Views 2.4k

Participants 4

I have a view that is part of a larger view. I have a preview of that part, but XCode draws a device (some iPhone model by default) around it. I can choose a different device with .previewDevice(PreviewDevice(rawValue: "...")). I found a screenshot of what I want to do, so I assume it's possible somehow:

Bildschirmfoto 2023-03-29 um 18.43.44.png

Unfortunately where I found the screenshot was not described how to do this. I tried previewDevice(.none), but that at least didn't do what I want. I'm using XCode version 14.3 Release Candidate, but can switch back version 14.2. Does anyone have an idea?

Answered by Claude31 in 749092022

It is explained in detail here: https://sarunw.com/posts/swiftui-preview-without-device-frame/

Add .previewLayout(.sizeThatFits) in Preview_Provider

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
            .previewLayout(.sizeThatFits)
    }
}

Then select the second left icon at the bottom of your screenshot

Boost

Answer 1

Claude31 OP

Mar ’23

Accepted Answer

It is explained in detail here: https://sarunw.com/posts/swiftui-preview-without-device-frame/

Add .previewLayout(.sizeThatFits) in Preview_Provider

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
            .previewLayout(.sizeThatFits)
    }
}

Then select the second left icon at the bottom of your screenshot

1

Answer 2

petrulutenco OP

Jan ’24

This approach does no longer work from Xcode 15, use #Preview(traits: .sizeThatFitsLayout) instead. Source: https://www.appcoda.com/swiftui-preview-macro

2