SwiftUI로 Mac App 만들기

[chaneeii]

Mac Apps 관련 References

Basics

• Apple official tutorials : https://developer.apple.com/tutorials/swiftui/creating-a-macos-app
• WWDC21 맥앱관련영상: https://developer.apple.com/videos/play/wwdc2021/10062/
• Rayenderlich - multiplatform : https://www.raywenderlich.com/19611194-multiplatform-app-tutorial-swiftui-and-xcode-12
• 2022 년 새로운 api 기준으로 : https://troz.net/post/2022/swiftui-mac-2022/
• 튜토리얼: https://troz.net/post/2019/swiftui-for-mac-1/
• 튜토리얼 영상 : https://www.youtube.com/watch?v=6Qa-SspgRMM
• mac app playlist : https://youtu.be/r0opgla9X-I
• tutorial (2020) : https://www.youtube.com/watch?v=hus2LksB3O4
• macos: https://www.youtube.com/watch?v=qZXkX9X0lfA&list=PLyVY0g4EEX5gM6mr2GZ8iZp2BPaKO6P29
• Multiplatform App Tutorial: SwiftUI and Xcode 12 : https://www.raywenderlich.com/19611194-multiplatform-app-tutorial-swiftui-and-xcode-12
• tutorial : https://www.alfianlosari.com/posts/building-macos-news-app-with-swiftui-3-and-newsapi/
• d이런저런 맥앱 기능 :https://kean.blog/post/appkit-is-done

Useful Articles

• Add toggle sidebar : https://sarunw.com/posts/how-to-toggle-sidebar-in-macos/
• AppKit is Done : https://kean.blog/post/appkit-is-done
• mac OS menu bar : https://www.youtube.com/watch?v=9QciOgymGso
• Preference tab : https://serialcoder.dev/text-tutorials/macos-tutorials/presenting-the-preferences-window-on-macos-using-swiftui/
• Mac OS Big Sur디자인 핸드북 : https://designcode.io/ios-design-handbook-design-for-macos-big-sur
• Building a native macOS app using SwiftUI and Combine : https://linkandreas.medium.com/building-a-native-macos-app-using-swiftui-and-combine-ee076d337cef
• Alert : https://troz.net/post/2019/swiftui-for-mac-3/
• About View: https://stackoverflow.com/questions/64624261/swiftui-change-about-view-in-macos-app
• open window library: https://iosexample.com/open-a-new-macos-10-12-window-with-swiftui-contents/
• open window : https://www.youtube.com/watch?v=cK4XNbM9KVw

[chaneeii]

SwiftUI for Mac - Part1

Setup

Xcode를 열어서 macOS 에서 App 템플릿을 선택하고 SwiftUI 로 프로젝트를 시작해주자!

Preview와 시뮬레이터 사용해보기

프로젝트를 생성하고 시뮬레이터를 실행해보자. 시뮬레이터를 실행할때는 My Mac을 선택한다!

그럼 이렇게 작고 귀여운 Mac App이 등장한다 😍 Canvas에서도 확인이 가능하다! 우리가 아는 Mac App 의 사이즈를 내기 위해서는 .frame() modifier를 이용해야한다.

그럼 이제 프레임 사이즈를 조절해보도록 하겠다. width와 height을 fix 하게 되면, 맥앱은 resize를 할 수 없다. 따라서 resizable 한 맥앱을 만들기 위해서는 아래와 같이 max/min 를 활용하여 modifer 를 설정하는 것이 중요하다.

.frame(minWidth: 600, minHeight: 400)
.frame(maxWidth: .infinity, maxHeight: .infinity)

그리고 맥앱을 개발할때는 아마도 화면 크기가 커져서 그런지 이렇게 따로 preview를 팝업으로 빼서 볼 수 있도록 preview를 제공한다!

View의 레이아웃 구성하기

이제 mac앱의 기본 레이아웃 형태 중 하나인 master-detail layout을 구성해보고자 한다. 우선 간단하게 텍스트의 리스트를 넣어보자!

References

https://troz.net/post/2019/swiftui-for-mac-1/

[samsung-ga]

퍼갑니다~

[chaneeii]

사이드바를 투명하게 만드는법

.listStyle(.sidebar) 을 사용하자

NavigationView {
    List(1..<10) {
         Text("\($0)")
    }
    .listStyle(.sidebar)
}

https://www.hackingwithswift.com/quick-start/swiftui/how-to-get-translucent-lists-on-macos

[chaneeii]

신호등 버튼 없애기

맥앱에서 신호등 버튼을 없애고 싶은 경우 이렇게 해결하면 되는데 더 좋은 방법이 있는지 알아봐야함.

        .onReceive(NotificationCenter.default.publisher(for: NSApplication.didBecomeActiveNotification), perform: { _ in
            NSApp.mainWindow?.standardWindowButton(.zoomButton)?.isHidden = true
//            NSApp.mainWindow?.standardWindowButton(.closeButton)?.isHidden = true
            NSApp.mainWindow?.standardWindowButton(.miniaturizeButton)?.isHidden = true
        })

ref https://stackoverflow.com/questions/66888981/how-can-i-remove-maximize-minimize-and-close-button-in-macos-in-swiftui-life-cy