SwiftUI macOS 타이틀바 제거하기

iOS와 macOS를 모두 지원하는 멀티플랫폼 앱을 만들 때 SwiftUI는 아주 유용하다.

그런데 SwiftUI를 사용한다고 해서 모든 플랫폼에 다 깔끔하게 디자인이 적용되는건 아니다.

macOS에서는 해당 앱에 대한 타이틀 자동으로 생성된다.

아이폰과 맥에서 다른거야 당연한 느낌인데, 비슷한 사이즈로 보이는 아이패드와 맥 모두에서 비슷한 사용자 경험을 주기위해서 타이틀바를 제거하고 싶은 경우가 있다.

타이틀만 제거하고 싶을 수도 있고, 타이틀 영역 자체를 제거하고 싶을 수도 있는데 SwiftUI에서 사용할 수 있는 몇 가지 방법에 대해서 알아보겠다.

SwiftUI macOS 타이틀바 제거를 위한 속성

import SwiftUI

@main
struct TestApp: App {
    
    var body: some Scene {
        WindowGroup {
            MainView()
                .toolbar(removing: .title)
                .toolbarBackgroundVisibility(.hidden, for: .windowToolbar)
        }
        .windowStyle(.hiddenTitleBar)
    }
}

1. 타이틀만 제거하기

.toolbar(removing: .title)

toolbar(removing:) 공식 문서

이 속성은 툴바에서 타이틀 영역만 제거한다. 툴바 자체는 그대로 유지되지만, 제목 텍스트만 표시되지 않게 된다. iOS, macOS, iPadOS 모두에서 사용할 수 있다.

• 동작: 툴바의 타이틀 텍스트만 제거
• 적용 범위: 뷰 수준에서 적용됨
• 주의점: 다른 툴바 아이템들(버튼 등)은 여전히 표시됨

2. 배경만 제거하기

.toolbarBackgroundVisibility(.hidden, for: .windowToolbar)

toolbarBackgroundVisibility(_:for:) 공식 문서

이 속성은 툴바의 배경만 투명하게 만든다. 툴바와 타이틀은 여전히 표시되지만, 배경이 투명해져서 아래 콘텐츠가 보인다.

• 동작: 툴바 배경만 투명하게 만듦
• 적용 범위: 창 툴바에 적용됨
• 주의점: 툴바 아이템과 타이틀은 그대로 표시됨, 단지 배경만 안 보임

3. 툴바 자체 제거하기

.windowStyle(.hiddenTitleBar)

WindowStyle 공식 문서

이 속성은 SwiftUI macOS 타이틀바에서만 사용 가능하며, 윈도우의 타이틀바 전체를 숨긴다. Scene 수준에서 적용되므로 WindowGroup에 직접 적용해야 한다.

• 동작: macOS에서 윈도우의 타이틀바 영역 전체를 숨김
• 적용 범위: 씬(Scene) 수준에서 적용됨
• 플랫폼: macOS 전용

결론적으로 상단 이미지에 보이는 타이틀만 제거하고 오른쪽에 보이는 툴바 아이템들은 사용하고 싶은 경우에, SwiftUI에서 macOS 윈도우의 앱 제목(타이틀)만 제거하고 싶다면 .toolbar(removing: .title) 이 방식이 가장 좋다.

마치며

SwiftUI macOS를 다룰 때, 타이틀바와 툴바를 제어하는 속성들을 적절히 활용하면 더 깔끔하고 사용자 친화적인 UI를 만들 수 있다.

크로스 플랫폼 앱을 개발할 때는 각 플랫폼별 특성을 고려해서 조건부로 적용하자.

.windowStyle(.hiddenTitleBar)의 경우, #If os(macOS)와 같은 플래그를 사용하면 된다.