Tweet
Tweet

Slide 1

Slide 1 text

SwiftUI入門
 merpay Tech Talk for iOS Engineers 
 
 佐藤剛士 2019 年 9 月 26日
 


Slide 2

Slide 2 text

Who am I
 ● Name
 ● 佐藤剛士(さとうたけし) 
 ● Company
 ● Merpay, Inc.(2019/01 ~) 
 ● Role
 ● Software Engineer (iOS) 
 ● Account
 ● Twitter: @hatakenokakashi 
 ● Facebook: 佐藤剛士 
 ● GitHub: SatoTakeshiX 


Slide 3

Slide 3 text

https://speakerdeck.com/satotakeshi/swiftuitutekonnayatu

Slide 4

Slide 4 text

今回はSwiftUIの概要を解説します


Slide 5

Slide 5 text

SwftUI入門


Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

SwiftUI
 ● ４つのコンセプト ● マルチプラットフォーム ● Xcode11のキャンバス・ライブプレビュー

Slide 8

Slide 8 text

４つのコンセプト
 ● Declarative 宣言的シンタックス
 ● Automatic 自動機能
 ● Compositional 組み合わせ可能
 ● Consistent 一貫性のあるUI状態


Slide 9

Slide 9 text

Declarative 宣言的シンタックス
 SwiftUIにどんなViewが必要なのかを指定する
 
 


Slide 10

Slide 10 text

Automatic 自動機能
 
 
 ● Dark Mode
 ● Dynamic Type
 ● 国際化
 ● アクセシビリティ


Slide 11

Slide 11 text

Compositional 組み合わせ可能
 
 
 
 
 Viewコンポーネントを切り出して組み合わせができる


Slide 12

Slide 12 text

Consistent 一貫性のあるUI状態
 
 
 
 
 データモデルをバインディング
 データが更新されると関連するViewのみが再レンダリング
 


Slide 13

Slide 13 text

Consistent 一貫性のあるUI状態
 
 
 
 


Slide 14

Slide 14 text

マルチプラットフォーム
 
 
 
 


Slide 15

Slide 15 text

Write once, run anywhere
 Learn once, apply anywhere　


Slide 16

Slide 16 text

Xcode11のキャンバス
 
 キャンバスからレイアウトを変更できる。 GUIで変更するとコードも自動で同期する。


Slide 17

Slide 17 text

Demo


Slide 18

Slide 18 text

Xcode11のプレビュー
 
 
 キャンバス上でその画面をプレビューできる。
 PreviewProviderプロトコルに準拠する型を定義する。
 Dynamic Typeごと、端末ごと、データの異なるViewのレイアウトが確認できる。
 


Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

ライブプレビュー
 
 
 キャンバスにある再生ボタンを押すとキャンバス上でその画面がビルド、実行される。


Slide 21

Slide 21 text

SwiftUIのView修飾子の仕組み


Slide 22

Slide 22 text

まとめ
 ● SwiftUIを使うと基本機能の実装時間が少なくなりアプリ独自の機能に時間を使え る
 ● SwiftUIのコンセプト
 ● マルチプラットフォーム
 ● Xcode11のキャンバス・ライブプレビュー
 ● (補足）View修飾子の仕組み


Slide 23

Slide 23 text

SwiftUIをはじめよう！