SwiftUI preview layout: size that fits does not work

Question

I want my preview to only have the size of the view and not show the whole iPhone. I have already tried it with this code:

struct TimerCardView: View {
   
    
    var body: some View {
        Text("Hello, World!")
            .padding()
            .background(.gray)
    }
}


struct TimerCardView_Previews: PreviewProvider {
    static var previews: some View {
        TimerCardView()
            .previewLayout(.sizeThatFits)
    }
}

but nothing happened. What am I doing wrong? I appreciate help

Maid

Answer 1

In Xcode 14+, the default mode for the Preview canvas is live mode, which as you’re seeing places your preview into a device screen context.

Manually adjusting the preview layout requires “selectable” mode, which was the default in previous versions of Xcode. You can switch between modes using the palette at the bottom of the toolbar canvas. For example:

Sententious

Answer 2

Xcode 15 you can do it.

#Preview(traits: .sizeThatFitsLayout) {
    ContentView()
}

Thoracotomy

And in addition to this, I think you have to also press the "selectable" mode like we see in the @Sententious answer. The Lord Always Delivers! – Retro

you need to add @available(iOS 17, *) before #Preview if you support iOS 16 and iOS 17 – Radiolucent

Interestingly, with Xcode 15.1, the preview is broken as long as you select My Mac in the preview simulation. Any iOS device works. – Juan