Open hyun99999 opened 2 years ago
Build a productivity app for Apple Watch - WWDC22 - Videos - Apple Developer
λ³Έ κΈμ WWDC λ₯Ό λ³΄κ³ , λ²μ λ° μμ½ κ·Έλ¦¬κ³ μ€νν΄λ³΄λ μ€ν°λ νλ‘μ νΈμ μΌνμ λλ€.
WatchOS νμμ App μ ννκ³ Next λ₯Ό ν΄λ¦νμ¬ λ§λ€ μ μμ΅λλ€.
μ΄λ Watch-only μ± μ λ§λ€μ§ iOS μ±μ΄ μλ Watch μ±μ λ§λ€μ§μ λν μ νμ§λ λ§€μ° μ€μν©λλ€.
watch μ±μ μν companon app μ΄ νμν μ΄μ λ μ¬λ¬κ°μ§κ° μμ΅λλ€. μλ₯Ό λ€μ΄ νΌνΈλμ€ μ±μ²λΌ μ ν μμΉμμ μΊ‘μ²ν λ°μ΄ν°μ κ³Όκ±° κΈ°λ‘, μΆμΈμ λν μμΈν λΆμμ μ 곡νλ κ²μ΄ μμ΅λλ€.
μ°λ¦¬κ° λ§λ€ μ±μ μ§μ€ν΄μΌνλ κΈ°λ₯κ³Ό λΉ λ₯Έ μνΈ μμ©, μ νλ λ°μ΄ν°λ₯Ό κ°μ§κΈ° λλ¬Έμ Watch-only app μ λ§λ€ κ²μ λλ€.
μμ±λ target μ λν΄μ μ κΉ μ΄μΌκΈ°λ₯Ό ν΄λ³΄κ² μ΅λλ€.
κ³Όκ±°μλ watch μ±μ λΉλνλ€λ©΄ νλ‘μ νΈμλ watch κ΄λ ¨ target μ΄ λ κ°κ° μκΉλλ€.(Test λ₯Ό ν¬ν¨νλ κ²½μ°μλ μΆκ°λ‘ μκΉλλ€.) μλμ κ°μ΄μ.
μ’ λ μμΈνκ² μ΄ν΄λ³΄κ² μ΅λλ€.
μΆμ²:
storyboard, assets, lacalization-related files κ° μλ WatchKit App target κ³Ό μ± μ½λκ° ν¬ν¨λ WatchKit Extension μ΄ μ‘΄μ¬ν©λλ€.
μ΄λ¬ν μ΄μ€ νκ²μ watchOS μ΄κΈ°λΆν° μ μ§λ κ²μ λλ€. μ΄μ μ¬λ¬ Watch target κ° μμ μ΄μ κ° μμ΅λλ€. Xcode 14 λΆν° μ Watch μ±μ λ¨μΌ Watch target λ§ κ°μ§λλ€.
code, assets, localizations, Siri Intent, Widget Extensions κΉμ§ Watch App μ κ΄λ ¨λ λͺ¨λ κ²μ΄ νλμ νκ²μ μνκ²λ©λλ€.
μ’μ μμμ single-target Watch app μ΄ watchOS 7 μμ μ§μλ©λλ€. μ΄λ₯Ό ν΅ν΄ μ΅μ watchOS κ° μλ κ³ κ°μ κ³μ μ§μνλ©΄μ νλ‘μ νΈ κ΅¬μ‘°λ₯Ό λ¨μννκ³ , νΌλκ³Ό μ€λ³΅μ μ€μΌ μ μμ΅λλ€.
λν, WatchKit Extension target μ΄ μλ κΈ°μ‘΄ μ±μ κ²½μ° κ³μ μλνλ©° Xcode λ₯Ό μ¬μ©νμ¬ μ±μ μ λ°μ΄νΈνκ³ μ± μ€ν μ΄μ μ¬λ¦΄ μ μμ΅λλ€.
μ΄λ―Έ SwiftUI life cycle μ μ¬μ©νλ Watch μ±μ΄λΌλ©΄ Xcode 14 migration tool λ‘ μ½κ² μ νν μ μμ΅λλ€.
μ΄μ μλ λ€μκ³Ό κ°μ΄ Life Cycle μ μ νν μ μμμ΅λλ€. Xcode 14 λΆν°λ λͺ¨λ SwiftUI λ‘ μ€μ λμ΄μ§λλ€.
μΆμ² :
Apple Developer Documentation - creating a watchOS app
target μ ν > Editor > Validate Settingsβ¦ μ νν©λλ€. deployment target μ΄ watchOS 7 μ΄μμ΄λΌλ©΄ target collapsing option(νκ² μΆμ μ΅μ )μ΄ μ 곡λ©λλ€.
ν μΌ λͺ©λ‘μ μΆκ°ν΄μ μ±μ λͺ κ°μ§ κΈ°λ₯μ μΆκ°ν΄ λ³΄κ² μ΅λλ€.
ν μΌ λͺ©λ‘μ λν λ°μ΄ν° λͺ¨λΈ μμ±ν©λλ€.
κ·Έλ° λ€μ λ°μ΄ν°λ₯Ό μ μ₯νκ³ νλͺ©μ λ°°μ΄μ κ²μνλ κ°λ¨ν λͺ¨λΈμ λ§λλλ€.
λ§μ§λ§μΌλ‘, λ·°κ° λͺ¨λΈμ μ‘μΈμ€ ν μ μλλ‘ λͺ¨λΈμ environment object λ‘ μΆκ°ν©λλ€.
μ΄μ model λ‘ List λ₯Ό λ§λλλ€. μ§κΈμ λΉ λͺ©λ‘μ΄ νμλ©λλ€. μ΄μ λν΄ μ¬λλ€μ΄ μΆκ°ν μ μλ λ°©λ²μ μ 곡ν΄μΌ ν©λλ€.
λ€μκ³Ό κ°μ΄ κ°λ¨ν λ¬Έμμ΄μ κ°μ§ TextFieldLink λ₯Ό λ§λ€κ±°λ
Label λ‘ λ κ°μ±μκ² λ§λ€ μ μμ΅λλ€.
view modifier λ‘ λ²νΌ λͺ¨μμ λ°κΏ μ μμ΅λλ€. foregroundColor λ foregroundStyle, buttonStyle λ±μ΄ μμ΅λλ€.
TextFieldLink μ μ€νμΌκ³Ό λμμ μΊ‘μννκΈ° μν΄ AddItemLink
λ·°λ₯Ό μμ±νκ² μ΅λλ€.
π§βπΒ : μ΄μ TextFieldLink λ₯Ό μΆκ°νκΈ°λ‘ νμμΌλ μμΉμ λν΄μ μκ°ν΄λ΄ μλ€.
Watch μ±μ λͺ©λ‘μ μμ μ μΆκ°ν λλ λͺ κ°μ§ μ΅μ μμ΅λλ€.
π¨Β κ·Έλ¬λ, λͺ©λ‘μ΄ κΈΈ κ²μΌλ‘ μμλλ κ²½μ°μλ λͺ©λ‘μ λκΉμ§ κ³μ μ€ν¬λ‘€ν΄μΌ ν©λλ€.
ToolbarItem μ μΆκ°νλ €λ©΄ List μ toolbar modifier λ₯Ό λ£κ³ , action view λ₯Ό μ½ν
μΈ λ‘ μ¬μ©νμΈμ.(μλ₯Ό λ€μ΄, μμμ λ§λ AddItemLink
)
1%84%92%E1%85%AE_4.08.53.png)
κ·Έλ¬λ©΄ μλμΌλ‘ λ¨μΌ toolbar item μ΄ μμΉν©λλ€.
π§βπΒ : μ λ ν μΌ λͺ©λ‘μ μ§§κ² μ°λ €κ³ νλλ° κ²°κ΅μλ κ·Έλ κ² μλλλΌκ΅¬μ! κ·Έλμ ToolbarItem μ TextFieldLink λ₯Ό λ£μ΄μ μ½κ² μ‘μΈμ€ν μ μκ² νκ² μ΅λλ€.
λ€μκ³Ό κ°μ΄ κ²°κ³Όλ₯Ό νμΈν μ μμ΅λλ€. environmentObject λ λΆλͺ¨ νΉμ μ‘°μ λ·°μμ μ 곡νλ observable object μ΄κΈ° λλ¬Έμ ItemListModel
μ μ¬μ©ν μ μμμ΅λλ€.
π§βπΒ : μ€λͺ λ§ μλ 리μ€νΈλ₯Ό λ§λλ κ²μ κ°λ¨νμ§λ§ κ·Έλ€μ§ μ μ©νμ§ μμ΅λλ€. νλͺ©μ μλ£λ‘ νμν μ μκ³ , μ°μ μμλ₯Ό μ€μ νλ λ°©λ²λ νμν μ μμ΅λλ€. μ΄λ₯Ό μν μμΈ λ·°λ₯Ό μΆκ°ν΄λ³΄κ² μ΅λλ€.
μμ) page-based navigation μ κ°μ₯ μ’μ μλ Workout μ±μ μ΄λ μ€ λ·°μ λλ€. μ€μμ΄ννλ©° μ΄λ μ μ΄, μ§ν, μ¬μ μ μ΄λ₯Ό μ½κ² μ νν μ μμ΅λλ€.
μμ) mail μ hierarchical style
λ‘ λ©μμ§μ λͺ©λ‘μ νμνκ³ κ° λ©μμ§ λλ μ€λ λλ₯Ό detail view λ‘ νμν©λλ€.
λ©μμ§ μΈλΆ μ 보μμ μνν μ μλ μμ μ΄ μμ§λ§ λͺ©λ‘μΌλ‘ λμκ°κΈ° μ μ μνν΄μΌλ§ νλ μμ μ μμ΅λλ€.
λͺ©λ‘μΌλ‘ λμκ°μ New Message λ₯Ό ννλ©΄
mail μ modal sheet λ₯Ό μ¬μ©ν΄μ New Message λ·°λ₯Ό νμν©λλ€.
SwiftUI μ NavigationStack μ λν λ΄μ©μ ν¬ν¨νμ¬ programmatic navigation μ λν΄ μμΈν μμλ³΄λ €λ©΄ SwiftUi cookbook for navigation μΈμ μ νμΈνμΈμ.
λͺ¨λ¬ μνΈλ₯Ό νμνλ €λ©΄ sheet presentation state λ₯Ό μ μ΄νλ νλ‘νΌν°κ° νμν©λλ€.
showDetails
νλ‘νΌν°κ° true μΌ λ custom modal sheet content λ₯Ό νμνκ² λ©λλ€.toolbar λ₯Ό μΆκ°νκΈ° μν΄μ μλμ κ°μ΄ μμ±ν μ μμ΅λλ€.
confirmationAction κ³Ό cancellationAction, destructiveAction λ±μ μ¬μ©νμ¬ toolbar item μ μμΉλ₯Ό μ€μ ν μ μμ΅λλ€.
μ°λ¦¬λ edit item μ νκ³ μμμΌλ―λ‘ detail view μμ modal sheet λ₯Ό μ¬μ©ν κ²μ λλ€.(μμ μ μλ£νκ³ done μ ννκΈ° μ κΉμ§ ν μμ μ μ§μ€ν κ²μ΄κΈ° λλ¬Έμ λλ€.)
μμ μμ , μμ λ μ§ λ° μλ£ λ μ§λ₯Ό μ μ₯νλ μλ‘μ΄ νλ‘νΌν°κ° μκ²Όμ΅λλ€.
μ΄λ¬ν μΈλΆμ 보λ₯Ό λ³΄κ³ νΈμ§ν μ μλ λ°©λ²μ μ 곡ν΄λ³΄κ² μ΅λλ€.
μ€λͺ μ νΈμ§νλ TextField μ μμ μλ£ μ¬λΆλ₯Ό νμνλ Toggle μ΄ μλ μμΈ λ·°λ₯Ό λ§λλλ€.
μμ μμ λμ κ°μ΄ λͺ¨λ μ«μμ΄κ³ , μ ν¨ν κ°μ λ²μλ₯Ό μ§μ ν μ μμ΅λλ€.
Stepper λ μμ°¨μ μΈ κ°μ νΈμ§ν μ μκ² μΈλΆνλ μ μ΄λ₯Ό μ 곡ν λ ν룑ν μ΅μ μ λλ€.
λν, Stepper λ₯Ό μ¬μ©νμ¬ λ Όλ¦¬μ , μμ°¨μ μΌλ‘ νΈμ§ν μ μμ§λ§ λ°λμ μ«μμΌ νμλ μμ΅λλ€. μλ₯Ό λ€μ΄ νλͺ©μ λν μμ μ€νΈλ μ€ μμ€μ κΈ°λ‘νκ³ μΆμ μ μμ΅λλ€.
(μ°Έκ³ : StressStepper μ μμ λ·°μΈ Stepper κ° κ°μ μμ νκΈ° μν΄μ $ λ₯Ό λΆμ¬μ μ¬μ©νκ² λ©λλ€.)
π§βπΒ : λͺ©λ‘μ μλ νλͺ©μ μΉκ΅¬μ 곡μ ν΄λ³΄λ©΄ μ’μ κ² κ°μ΅λλ€.
detail view μ νλͺ©μ 곡μ ν μ μλλ‘ share sheet λ₯Ό μ¬μ©ν΄λ³΄κ² μ΅λλ€.
μΉκ΅¬ λͺ©λ‘μμ μ νν΄μ λ©μμ§λ₯Ό νΈμ§νμ¬ λμμ μμ²ν μ μμ΅λλ€.
μ΄λ₯Ό μν΄μ watchOS 9 λΆν° SwiftUI μλ‘μ΄ λκ΅¬μΈ ShareLink λ₯Ό μ¬μ©ν μ μμ΅λλ€.
Meet Transferable μΈμ μ κΌ νμΈν΄ 보μΈμ. ShareLink μ λν μμΈν λ΄μ©κ³Ό μ΅μ μ μ μ μμ΅λλ€.
π§βπΒ : μ΄μ νλͺ©μ μλ£ν μκ°μ μΆμ νκ³ , μμ μ μλ£νκΈ° μν΄ λμμ μμ²ν μ μμΌλ―λ‘ μμ°μ±μ 보기 μν΄ μ°¨νΈλ₯Ό μΆκ°νκ³ μΆμ΅λλ€.
λ¨μΌ λ°μ΄ν°μ κ³ μ ν κ°μ΄ μκΈ° λλ¬Έμ λ§λ μ°¨νΈλ₯Ό μ¬μ©νκ² μ΅λλ€.
μ±μ navigation structure μ chart view λ₯Ό μΆκ°νλ κ²μΌλ‘ μμνκ² μ΅λλ€.
list-detail κ΄κ³κ° μκΈ° λλ¬Έμ page-based navigation strategy μ ννμ¬ μΈμ λ μ§ λͺ©λ‘κ³Ό μ°¨νΈ μ¬μ΄λ₯Ό μ€μμ΄νν μ μλλ‘ νκ² μ΅λλ€.
μ΄λ₯Ό μν΄μ λͺ©λ‘ λ·°λ₯Ό μΊ‘μννλ ItemList
λΆν° λ§λ€κ² μ΅λλ€.
μ°¨νΈ λ·°μ λν ꡬ쑰λ₯Ό λ§λ€κ² μ΅λλ€. μ°μ , navigation structure μ μ§μ€νκΈ° μν΄μ μμλ‘ μ΄λ―Έμ§λ₯Ό λ£κ² μ΅λλ€.
page-style μ TabView λ‘ μ€μ νμμ΅λλ€.
SwiftUI Canvas λ₯Ό μ¬μ©ν΄μ μ°¨νΈλ₯Ό 그릴 μ μμ§λ§ watchOS 9 λΆν°λ Swift Charts κ° μμ΅λλ€. μ΄λ iOS, macOS, tvOS μμλ μ¬μ©ν μ μμΌλ―λ‘ SwiftUI λ₯Ό μ¬μ©νλ λͺ¨λ κ³³μμ μ°¨νΈλ₯Ό μ¬μ¬μ©ν μ μμ΅λλ€.
μ°λ¦¬λ μ΄ μ°¨νΈλ₯Ό λ μ§λ³λ‘ μλ£λ νλͺ© μλ₯Ό νμνλ €κ³ ν©λλ€.
κ·Έλ¦¬κ³ λ°μ΄ν°λ₯Ό μ§κ³νλ createData(_:)
λ©μλλ μμ±ν©λλ€.
(κ°μ λ μ§μ data κ°―μλ§νΌ μλ£λμλ€κ³ μ€μ νλ λ©μλ)
data λ‘ κ³μ΄μ μ μνκ³ , λ μ§λ₯Ό x κ°μΌλ‘, y λ μλ£λ νλͺ©μ μλ‘ μ°¨νΈλ₯Ό νμνκ² μ΅λλ€.
chartXAxis modifier λ₯Ό μ¬μ©νμ¬ AxisValueLabel μ μ€νμΌμ μ§μ νμμ΅λλ€.(axis λ μΆ)
μΈλ‘ λκΈμ μ μνμ§ μκΈ° λλ¬Έμ AxisGridLine λ₯Ό μλ΅νμ΅λλ€.
chartYAxis modifier λ‘ y μΆμ μ μνκ² μ΅λλ€.
AxisGridLine μΌλ‘μ°¨νΈμ μ΄μΈλ¦¬λ λκΈμ μ€νμΌμ μ§μ νμμ΅λλ€.
AxisValueLabel μ format μ μ μλ‘ μ§μ νκ³ μλ¨ λ μ΄λΈμ μλ΅νμ¬ μ°¨νΈ μλ¨μ΄ μ리λ κ²μ λ°©μ§νμ΅λλ€.
Swift Charts λ‘ ν μ μλ κ²μ μμΈν μμλ³΄λ €λ©΄ μλμ μΈμ μ νμΈνμΈμ.
π§βπΒ : λ λ§μ λ°μ΄ν°λ₯Ό 보μ¬μ£Όκ³ μΆμ΅λλ€. μ€ν¬λ‘€μ΄ κ°λ₯νλλ‘ ν΄λ³΄κ² μ΅λλ€.
μ΄λ₯Ό λ¬μ±νκΈ° μν΄ digitalCrownRotation modifier μ¬μ©ν κ²μ λλ€. Digital crown μ΄λ²€νΈμ λν μ½λ°±μ μ€μ ν μ μμ΅λλ€. μ΄λ₯Ό ν΅ν΄ μ°¨νΈμ λν μ¬μ©μ μ μ μ€ν¬λ‘€ λμμ ꡬννκ² μ΅λλ€.
highlightedDateIndex
λ₯Ό ν΅ν΄ νμ¬ μ€ν¬λ‘€ μμΉμ λν μΈλ±μ€λ₯Ό μ¬μ©νκ² μ΅λλ€.crownOffset
μ μ μ₯νκ² μ΅λλ€. crown μ΄ μμ§μ΄λ λμ λ°μ΄ν° ν¬μΈνΈ μ¬μ΄μ κ°μ
λλ€.isCrownIdle
μ μ¬μ©ν©λλ€. μ΄λ₯Ό μ¬μ©νμ¬ crown μ€ν¬λ‘€μ΄ λ©μΆκ³ μμλ λ μ½κ°μ μ λλ©μ΄μ
μ μΆκ°νκ² μ΅λλ€.digitalCrownRotation modifier λ₯Ό μΆκ°ν μ μμ΅λλ€.
onChange
μ½λ°± νΈλ€λ¬μ
λλ€. μ¬κΈ°μ isCrownIdle
κ°μ false
λ‘ μ€μ ν©λλ€.crownOffset
κ°μ νμ¬ κ°μΌλ‘ μ€μ ν΄μ€λλ€.onIdle
μ½λ°± νΈλ€λ¬μμ isCrownIdle
κ°μ true
λ‘ μ€μ ν©λλ€.detent λΌλ μ©μ΄λ₯Ό κ°λ°μ λ¬Έμμμ μ¬μ©νλλ° λ©μΆ€μ λΌκ³ ν΄μνκΈ°μ μ‘°κΈ λΆμ‘±ν¨μ΄ μμλ€. κ·Έλ¬λ μ€ WWDC22 μΈμ
Build a productivity app for Apple Watch
μμ λ£κ² λμ΄μ λ°μ·νλ€.
detent λ κΈ°κ³μ μ©μ΄λ‘ μμ§μΌ λ§νΌ μΆ©λΆν νμ΄ κ°ν΄μ§ λκΉμ§ 무μΈκ°λ₯Ό μ μ리μ κ³ μ μν€λ λ©μ»€λμ¦μ λλ€.
μλ₯Ό λ€μ΄, μ°¨ λ¬Έμ μ΄ λ μμ°©λλ βμ μ§β μμΉκ° μλ€. λ¬Έμ μ‘°κΈ λ μΈκ² λ°μ΄ λ λ€λ₯Έ βμ μ§β μμΉκΉμ§ λ μ΄ μλ μλ€.
λ¬Έμ λ«μΌλ €λ©΄ βμ μ§βμμ λΉΌλΌ μ μμ λ§νΌ μΈκ² λΉκ²¨μ μ νμ μ΄κ²¨λ΄μΌ ν©λλ€. κ·Έλ μ§ μμΌλ©΄ λ¬Έμ βμ μ§β μμΉλ‘ λμκ°λλ€. μ΄κ²μ΄ detent μ λλ€.
μ΄μ²λΌ νλΌλ―Έν° detent
λ crown μ μ§ ν±λ μν μ
λλ€.
μ΄μ μ°¨νΈμμ μ€ν¬λ‘€ν λ crown μ μμΉλ₯Ό νμν μ μκ³ , μ΄λ₯Ό μν΄ Swift Charts
μ RuleMark
λ₯Ό μ¬μ©ν μ μμ΅λλ€. RuleMark
λ μ°¨νΈμμ μ§μ μ
λλ€. μνμ νΉμ μμ§μ μΌλ‘ μκ³κ°μ νμνκ±°λ κ²½μ¬μ μ νμν μ μμ΅λλ€.
π§βπΒ : 보기 μ’κ² νκΈ° μν΄μ crown μ΄ μμ§μ΄μ§ μμ λ μ μ ν¬λ―Ένκ² νκ³ μΆμ΅λλ€.
μ΄λ isCrownIdle μμ±μ μ¬μ©νμ¬ κ°λ¨ν μ λλ©μ΄μ μ ν μ μμ΅λλ€.(μμ μΈκΈνλ μ€ν¬λ‘€μ΄ λ©μΆκ³ μμν λμ μ λλ©μ΄μ μ λ§ν¨)
onChange
modifier λ₯Ό μΆκ°ν΄μ isCrownIdle
κ°μ΄ λ³κ²½λ λ crownPositionOpacity
κ° λ³κ²½μ΄ μ λλ©μ΄μ
κ³Ό ν¨κ» νλλ‘ ν©λλ€.crownPositionOpacity
λ₯Ό νμ©ν΄μ RuleMark
foregroundStyle
μ λ°μν μ μμ΅λλ€.μ€ν¬λ‘€ν λ μ°¨νΈμ λ§λ μμκ°μ νμνκΈ° μν΄μ annotation μ μΆκ°νλ©΄ λ©λλ€.
μλ¨μ ννμ κ°μ μΆκ°νλλ° λ§μ§λ§ λ§λμμλ μλ¨ μ νμ μΆκ°νκ² μ΅λλ€.
π§βπΒ : μ€ν¬λ‘€ κ°λ₯ν μ¬μ©μ μ μ μ°¨νΈλ₯Ό λ§λλ λ§μ§λ§ λ¨κ³λ μ€ν¬λ‘€ν λ μ°¨νΈμ λ°μ΄ν° λ²μλ₯Ό μ‘°μ νλ κ²μ λλ€.
μ°¨νΈμ λ²μ λ°μ΄ν°λ₯Ό μ 곡νκΈ° μν΄μ chartData
λ³μλ₯Ό μμ±νκ³ highlightedDateIndex
κ°μ΄ λ³κ²½λ λ νμν κ²½μ° μ
λ°μ΄νΈ ν©λλ€.
(23λΆ 8μ΄λΆν° ꡬνλ κΈ°λ₯ νμΈ κ°λ₯.)
watchOS 9 μμ μ¬μ©ν μ μλ μλ‘μ΄ SwiftUI κΈ°λ₯μ λν΄ μμΈν μμλ³΄λ €λ©΄ μλμ μΈμ μ μμ²ν΄μ£ΌμΈμ.