WWDC20 Recap of SwiftUI & Combine

Event: https://mercari.connpass.com/event/180254/
Some demos and screenshots are hidden due to NDA of Apple Developer Program.

Transcript

1. WWDC20 RECAP OF
   SWIFTUI & COMBINE
   @kagemiku (Akira Fukunaga) / Recap of WWDC20 at Mercari
   

   View Slide

2. ABOUT ME
   ▸ kagemiku (Akira Fukunaga)
   ▸ GitHub: @kagemiku
   ▸ Twitter: @kagemiku_en
   ▸ Software Engineer at Mercari JP
   ▸ Team: Client Architect
   ▸ Joined: April, 2019 (new grads) Last year
   

   View Slide

3. RECAP OF
   ɾSWIFTUI
   ɾCOMBINE
   

   View Slide

4. RECAP OF SWIFTUI
   ▸ App structure
   ▸ List and Collections
   ▸ New Components and Effect
   ▸ Data Managements
   

   View Slide

5. RECAP OF SWIFTUI
   ▸ App structure
   ▸ List and Collections
   ▸ New Components and Effect
   ▸ Data Managements
   

   View Slide

6. APP STRUCTURE
   projectApp.swift ContentView.swift
   No need AppDelegate.swift and SceneDelegate.swift
   

   View Slide

7. APP STRUCTURE
   projectApp.swift
   BETA VERSION
   SCREENSHOT
   

   View Slide

8. APP STRUCTURE
   projectApp.swift
   
   

   View Slide

9. APP STRUCTURE
   ▸ @main
   ▸ New attributes for indicating top-level entry point for program flow (Swift 5.3)
   ▸ detail: https://docs.swift.org/swift-book/ReferenceManual/
   Attributes.html#ID626
   

   View Slide

10. APP STRUCTURE
    ▸ App
    ▸ New protocol for representing the structure and behavior of an app.
    ▸ This protocol has `main` entry point
    

    View Slide

11. ▸ Scene & WindowGroup
    ▸ iOS14 introduces App/Scene/View hierarchy in SwiftUI protocol
    APP STRUCTURE
    APP
    SCENE
    VIEW
    VIEW
    ↑
    Independent State
    ↓
    

    View Slide

12. RECAP OF SWIFTUI
    ▸ App structure
    ▸ List and Collections
    ▸ New Components and Effect
    ▸ Data Managements
    

    View Slide

13. LIST AND COLLECTIONS
    ▸ LazyHStack & LazyVStack
    ▸ Finally, LazyStack is provided!
    ▸ Inside contents are initialized lazily
    BETA VERSION
    SCREENSHOT
    

    View Slide

14. LIST AND COLLECTIONS
    ▸ (DEMO) When using normal VStack
    BETA VERSION
    SCREENSHOT
    

    View Slide

15. LIST AND COLLECTIONS
    ▸ (DEMO) When using LazyVStack
    BETA VERSION
    SCREENSHOT
    

    View Slide

16. LIST AND COLLECTIONS
    ▸ LazyHGrid & LazyVGrid
    ▸ Finally, UI components like Collection are provided!
    BETA VERSION
    SCREENSHOT
    

    View Slide

17. LIST AND COLLECTIONS
    ▸ LazyHGrid & LazyVGrid
    BETA VERSION
    SCREENSHOT
    BETA VERSION
    SCREENSHOT
    BETA VERSION
    SCREENSHOT
    

    View Slide

18. RECAP OF SWIFTUI
    ▸ App structure
    ▸ List and Collections
    ▸ New Components and Effect
    ▸ Data Managements
    

    View Slide

19. NEW COMPONENTS AND EFFECT
    ▸ Toolbar and Label
    ▸ You can put toolbar item with Label ( = Text + Image )
    BETA VERSION
    SCREENSHOT
    

    View Slide

20. NEW COMPONENTS AND EFFECT
    ▸ ProgressView
    BETA VERSION
    SCREENSHOT
    

    View Slide

21. NEW COMPONENTS AND EFFECT
    ▸ Link and openURL environment action
    ▸ Open external URL with default browser
    BETA VERSION
    SCREENSHOT
    

    View Slide

22. NEW COMPONENTS AND EFFECT
    ▸ (DEMO) matchedGeometryEffect: interpolates animation
    BETA VERSION
    SCREENSHOT
    

    View Slide

23. RECAP OF SWIFTUI
    ▸ App structure
    ▸ List and Collections
    ▸ New Components and Effect
    ▸ Data Managements
    

    View Slide

24. DATA MANAGEMENTS
    ▸ @StateObject
    ▸ New property wrapper for `ObservableObject`
    ▸ Creation and destruction is tied to the views life cycle
    @StateObject @ObservedObject
    created view is created struct is initialized
    destructed view is destructed struct is destructed
    

    View Slide

25. DATA MANAGEMENTS
    ▸ @StateObject
    ▸ New property wrapper for `ObservableObject`
    ▸ Creation and destruction is tied to the views life cycle
    

    View Slide

26. DATA MANAGEMENTS
    ▸ SceneStorage and AppStorage
    ▸ SceneStorage: Scene-scoped data storage
    ▸ AppStorage: App-scoped data storage (using UserDefaults)
    

    View Slide

27. TEXT
    RECAP OF COMBINE
    

    View Slide

28. TEXT
    RECAP OF COMBINE
    ▸ Almost nothing
    ▸ a bit new things……….
    

    View Slide

29. RECAP OF COMBINE
    ▸ assign(to:)
    ▸ Republishes elements received from a publisher to @Published property
    

    View Slide

30. SUMMARY
    ▸ Recap of SwiftUI
    ▸ App protocol structure is renewed
    ▸ App -> Scene -> View
    ▸ AppStorage and SceneStorage for storing data
    ▸ Lazy stacks and Grid components are provided
    ▸ New property wrapper @StateObject is introduced
    ▸ Recap of Combine
    ▸ Let’s expect next year’s WWDC!
    

    View Slide