How to create window without border between title bar and content view?

Question

Created Sep ’23

Replies 2

Boosts 0

Participants 2

I'm trying to achieve the look seen below in Xcode's about window, where there is no border between the title bar of the window and the content view, but I can't seem to get rid of the border between the title bar and the content view.

Screenshot 2023-09-21 at 01.12.13.png

This is my code:

struct MyView: View {
    var body: some View {
        HStack {
            Text("Hello world")
        }
        .frame(width: 200, height: 200)
    }
}

...

myWindow = NSWindow(
    contentRect: NSRect(x: 0, y: 0, width: 200, height: 200),
    styleMask: [.closable, .titled],
    backing: .buffered, defer: false)
myWindow.contentView = NSHostingView(rootView: MyView())

Which results in:

Screenshot 2023-09-21 at 01.12.43.png

Boost

Answer 1

BabyJ OP

Sep ’23

This style of window is without the title bar. You would need to remove/hide it to get this effect.

In SwiftUI, you would add this modifier to your main App:

WindowGroup {
    ContentView()
}
.windowStyle(.hiddenTitleBar) // add this modifier here

However, it seems like you are using the AppKit lifecycle which means you will have to do this:

myWindow = NSWindow(
    contentRect: NSRect(x: 0, y: 0, width: 200, height: 200),
    styleMask: [.closable, .titled, .fullSizeContentView], // can make the contentView consume the full size of the window
    backing: .buffered, defer: false)

// Modify these two properties
myWindow.titleVisibility = .hidden
myWindow.titlebarAppearsTransparent = true

0

Answer 2

kkyr OP

Sep ’23

Works like a charm, huge thanks @BabyJ!

0