SwiftUIってこんなやつ

Recap of WWDC19
https://mercaridev.connpass.com/event/132676/

の発表資料です。

参考URL
・https://developer.apple.com/tutorials/swiftui/
・https://blog.personal-factory.com/2019/06/07/understand-swiftui-code/
・https://blog.personal-factory.com/2019/06/12/relationship-between-vstack-hstack-and-function-builder-in-swiftui/

Transcript

1. SwiftUIってこんなやつ

   Recap of WWDC19

   

   佐藤剛士 2019 年 6 月 13日

   

   

   View Slide

2. Who am I

   ● Name

   ● 佐藤剛士(さとうたけし) 

   ● Company

   ● Merpay, Inc.(2019/01 ~) 

   ● Role

   ● Software Engineer (iOS) 

   ● Account

   ● Twitter: @hatakenokakashi 

   ● Facebook: 佐藤剛士 

   ● GitHub: SatoTakeshiX 

   

   View Slide

3. SwftUIとは？

   

   View Slide

4. SwiftUI

   ● 全く新しいレンダリングシステム

   ● Pure Swift

   ● 宣言的レイアウト

   ● Design Tools on Xcode11

   ● Preview on Xcode11

   ● iOS13 or later

   

   View Slide

5. https://developer.apple.com/tutorials/swiftui/

   

   View Slide

6. チュートリアルアプリをみてみよう

   

   View Slide

7. Use the features of Swift5.1

   ● Opaque Result Type

   ● Implicit return from single-expression functions

   ● Function Builder

   

   View Slide

8. Opaque Result Type

   

   

   ● 具体的な型を隠蔽したまま実行時のオーバーヘッドを支払わずに済す方法

   ● Swift 5.1 に導入される Opaque Result Type とは何か

   ● some修飾子をつけることでOpaque Result Typeであることを表します。

   

   
struct ContentView: View {
   var body: some View {// Opaque Result Type!
   VStack {...}
   }
   }

   

   View Slide

9. Implicit returns from single-expression functions

   ● 今までクロージャーでは１ステートメントならreturnなしで値を返せた

   ● それを関数、コンピューテッドプロパティ、subscriptも認める機能

   var body: some View {
   VStack {...} // bodyはVStackというインスタンスを返すコンピューテッドプロパティ
   }
   // 上記と下記は同じ意味
   var body: some View {
   get {
   return VStack{...}
   }
   }
   

   View Slide

10. Function Builder

    ● 独自のAttributeを定義できる

    ● SwiftUIではViewBuilderというAttributeを定義している

    @available(iOS 13.0, OSX 10.15, tvOS 13.0, watchOS 6.0, *)
    @_functionBuilder public struct ViewBuilder {
    /// Builds an empty view from an block containing no statements, `{ }`.
    public static func buildBlock() -> EmptyView
    /// Passes a single view written as a child view (e..g, `{ Text("Hello")
    }`) through
    /// unmodified.
    public static func buildBlock(_ content: Content) -> Content where
    Content : View
    }
    

    View Slide

11. ViewBuilder

    VStack {
    MapView()
    CircleImage()
    Text("Turtle Rock")
    }
    VStack {
    ViewBuilder.buildBlock(
    MapView(),
    CircleImage(),
    Text("Turtle Rock")
    )
    }
    

    View Slide

12. まとめ

    ● SwiftUIでView構築が断然楽になる

    ● 豊富なチュートリアルですぐにキャッチアップ可能！

    ● Swift5.1の機能をふんだんに使っている

    ○ Opaque Result Type 

    ○ Implicit returns from single-expression functions 

    ○ ViewBuilder/Function Builder 

    

    View Slide

13. SwiftUIをはじめよう！

    

    View Slide