안녕, SwiftUI

우린 아직 만나기 이른 것 같아... ^_^  iOS 14에서 만나자..

안녕하세요 iOS 개발하는 지니 입니다 （╹◡╹）

2월 말, iOS Deployment Target을 13으로 올렸고

이번주부터 SwiftUI 적용을 슬슬 해보려고 하고 있습니다. 

사실 iOS 14 이상은 되어야지 SwiftUI 할 만하다고 생각을 하는데요,,, (토이프로젝트 경험상)

파트 내의 'SwiftUI 경험치 쌓기' 를 목표로 

사용자들에게 노출이 안되고 디자인이 간단한 실험실 쪽 화면들부터 SwiftUI로 전환해볼 계획입니다.

SwiftUI 도입기는 컨퍼런스 발표영상이 많으니 그것을 참고해주시고

SwiftUI 고난기로 봐주셔도 될 것 같네요 ㅎㅎ.. 

관전 포인트는 두가지 입니다. 

- 신규 프로젝트가 아니라 기존 프로젝트에 SwiftUI를 도입하면 어떨까?

- iOS 13 이상 지원으로 SwiftUI를 도입하면 얼마나 없는 API가 많을까? 분기를 많이 해야할까?

[1] 사전 준비

# Swift Pacakage 만들기

SwiftUI로 개발을 하면 Preview를 바로 볼 수 있는 게 큰 장점인데요!

신규 프로젝트가 아니라 기존 프로젝트의 경우,

앱 타겟에 SwiftUI 코드를 추가하면 앱 전체를 빌드하므로 Preview 로딩 시간이 매우 느립니다...

그래서 SwiftUI 뷰들을 모아둘  ModernUI 라는 Swift Package를 만들었어요 

(참고: Organizing Your Code with Local Packages)

위처럼 ModernUI Scheme 을 선택해두고 작업하시면 이 패키지만 빌드하므로 빠르게 Preview를 보실 수 있습니다!

# Resource in Swift Pacakge

Package.swift에 Swift tools version을 5.3 이상으로 선언하면

Swift Package에 resource (asset catalog, storyboard 등) 를 포함할 수 있습니다. 

(참고: Bundling Resources with a Swift Package)

문서에 important 라고 나와있는데, 

Swift Package 내에서 resource를 접근하려면 Bundle.module을 사용해줘야합니다. 

https://developer.apple.com/documentation/swift_packages/bundling_resources_with_a_swift_package

그래서 저는 아래와 같은  Image extension을 만들어줬습니다. 

https://gist.github.com/eunjin3786/2c8dbda3857668a76947e2fcf2557117

# PreviewWrapper  

Preview로 라이트모드, 다크모드, 가로모드를 다 보면 좋으니

PreviewWrapper도 만들어줍니다.

https://gist.github.com/eunjin3786/b2381d022032767af0a7537ff78885e2

그럼 화면작업할 때 이런 식으로 쓸 수 있습니다. 

[2] 고난.. 

위의 사전 작업을 마치고 신나게 SwiftUI 개발을 해보려고 했으나...

# 애플도_네이밍은_어려워

애플의 네이밍 번복(?) 으로 인터페이스 혼란이 좀 있습니다..

iOS 13 서포트를 해야하기 때문에 deprecated 된 인터페이스를 사용해주고 

추후 iOS 14 + 인터페이스로 교체해야하는 번거로움은 덤이군요,,,

(버전 분기를 미리해주는 방법도 있긴 합니다.)

1) 네비게이션타이틀

iOS 13.0–15.4 (deprecated)

https://developer.apple.com/documentation/swiftui/view/navigationbartitle(_:)-6p1k7

iOS 14.0+

https://developer.apple.com/documentation/swiftui/view/navigationtitle(_:)-5di1u

2) 접근성 라벨

iOS 13.0–15.4 (deprecated)

https://developer.apple.com/documentation/swiftui/view/accessibility(label:)

iOS 14.0+

https://developer.apple.com/documentation/swiftui/view/accessibilitylabel(_:)-5f0zj

# 애플도_인터페이스_고민을_많이_해

iOS 14 + 부터는 navigationBarItems 말고 

toolbar(content:) 를 쓰기를 권장합니다.  

https://developer.apple.com/documentation/swiftui/view/navigationbaritems(trailing:)

이건 단순히 네이밍 수정을 넘어 

추후 코드 추가작업이 필요해보이네요,, 

# iOS_13_에는_없는게_너무_많아요

1) 

List의 Row Separator 를 hidden 처리할 수 있는 listRowSeparator(_:edges:) 는 iOS 15+ 입니다. 

스택오버플로우를 보면 iOS 13, iOS 14, iOS 15 를 각각 대응하는 방법이 나오는데

머리가 아프네요...

https://stackoverflow.com/questions/56553672/how-to-remove-the-line-separators-from-a-list-in-swiftui-without-using-foreach

How to remove the line separators from a List in SwiftUI without using ForEach?

2) 

그리고 UI에서 자주쓰는 Grid (LazyHGrid, LazyVGrid) 도 iOS 14+ 이죠..?

iOS 13에서는 List 나 Stack 을 이용해서 Grid 를 만들어줘야해요 ㅠㅠ

Grid 를 만들어야하는 상황이 아직 오지 않았으나 벌써부터 버전 분기하기 싫으네요..

3)

또한 value change 감지를 위해 필요한  onChange(of:perform:)  도 iOS 14+ 랍니다. 

이건 제가 개인프로젝트할 때 분기처리 해본 적이 있는데,  

[SwiftUI] iOS13에서 onChange(of:perform:) 을 사용하고 싶을 때 글을 참고해주세요~

[3] 결론

역시는 역시다! SwiftUI는 iOS 14 부터 할만하다,, 

하지만 iOS 14로 올리기 전에 두가지를 해두면 좋다고 생각합니다. 

1. 미리 모듈화를 잘 해두면 좋습니다.

(Swift Package 별로 빌드할 수 있게 해놓고 패키지의 dependencies 설정도 최소한으로 해두면 

Preview 로딩 속도가 빨라지고 SwiftUI로 빠르게 개발할 수 있을 것.)

2. 아~주 간단한 화면은 SwiftUI로 전환 또는 작업하고 코드리뷰도 하고.. 하면서

파트 내의 경험치를 쌓아두면 좋습니다. 

우리는 채용 중

함께 SwiftUI를 공부하고 적용하실 분을 기다리고 있어요 :-)

https://tech.kakao.com/2022/03/21/client-recruitment-01/

[Ka-reer Up!] 글을 읽고 쓰는 경험을 제공하는 창작자앱개발파트 이야기

https://careers.kakao.com/jobs/P-12460?skilset=iOS

카카오 영입