Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
Ankoでコンポーネント指向 2016/12/13 第4回 Kotlin勉強会 @ Sansan @kkagurazaka
Slide 2
Slide 2 text
自己紹介 ● @kkagurazaka ● 普段はC++で画像処理とか ● Kotlin lover ● 趣味Androider RxProperty for Android https://github.com/k-kagurazaka/rx-property-android
Slide 3
Slide 3 text
初LTです
Slide 4
Slide 4 text
コンポーネント指向 ● 近年Webフロント界隈で注目 ● プレゼンテーション層のパラダイム
Slide 5
Slide 5 text
普通のModel-View-Presenter View Presenter ● View Template ● UI State ● Event Handling ● View Controller
Slide 6
Slide 6 text
普通のModel-View-ViewModel View ViewModel ● View Template ● Event Handling ● UI State
Slide 7
Slide 7 text
コンポーネント指向 AllTasksComponent View ViewModel ToolbarComponent View ViewModel TaskListComponent View ViewModel TaskComponent View ViewModel FABComponent View ViewModel
Slide 8
Slide 8 text
Reactの場合 UI State Event Handling View Template
Slide 9
Slide 9 text
なにが嬉しいのか？ ● 関心の分離 View TemplateとPresentation Logicの分離は「技術による分離」 ● カプセル化 1つのコンポーネントに関心事項が収まる ● 再利用性 一度定義したコンポーネントは使い回せる
Slide 10
Slide 10 text
Presentational / Container Component Presentational Container 関心 どう見えるか どう動くか データ読み込み 親コンポーネントから与え られる モデルから取得 データ書き込み 親コンポーネントから与え られるコールバックを呼ぶ モデルのロジックをキック 内部状態 （なるべく）持たない 持つ
Slide 11
Slide 11 text
Presentational / Container Component Container Presentational Container Presentational Presentational Presentational Presentational Presentational Presentational
Slide 12
Slide 12 text
Androidの場合は？
Slide 13
Slide 13 text
● Container Component ○ Activity / Fragment ○ イベントを受けてモデルをキックする、実質Presenter ● Presentational Component ○ (Custom) View / Composite View ○ 親から受け取った値を表示するだけ ● View Template ○ layout.xml + DataBinding ○ でコンポーネントのネストを実現
Slide 14
Slide 14 text
layout.xml + DataBindingの辛み ● XMLそのものが辛い ○ タイプセーフじゃない ○ DataBinding周りの補完が不十分 ○ Javaコードと行ったり来たり ● エラーの原因がわかりにくい ○ Android Studioでうまくエラーメッセージ出ない経験ないですか？ ● Kotlinとの相性がイマイチ ○ 大分マシにはなったものの、kaptは問題が起きやすい
Slide 15
Slide 15 text
No content
Slide 16
Slide 16 text
Anko ● KotlinでAndroidアプリ開発するのに便利な機能たくさん ○ layout.xmlをKotlin上でDSLとして・・・ ○ 非同期処理を簡単に・・・ ○ SQLiteも簡単に・・・ ○ その他便利なユーティリティ多数 ● JetBrains製
Slide 17
Slide 17 text
Layout DSL ● タイプセーフ・nullセーフ ● 再利用性が高い ● パース時間ゼロ ● DataBinding不要 ⇒コンポーネント作れる！
Slide 18
Slide 18 text
やってみよう
Slide 19
Slide 19 text
No content
Slide 20
Slide 20 text
1. AnkoComponentを継承してLayout DSL
Slide 21
Slide 21 text
2. 外部とのI/F定義 ダサい・・・
Slide 22
Slide 22 text
Bound call references (since Kotlin 1.1)
Slide 23
Slide 23 text
Javaのgetter/setterから自動生成されたプロパティには未対応
Slide 24
Slide 24 text
気を取り直して・・・
Slide 25
Slide 25 text
3. DSL内で使える拡張関数を定義 あとは同じようにコンポーネントを作っていくだけ！
Slide 26
Slide 26 text
まとめ ● Ankoを使えばAndroidでもコンポーネント指向はできる ● ただし、まだネタ枠 ○ タブレット対応どうする？ ○ アーキテクチャどうする？ ○ propsのバケツリレーどうする？
Slide 27
Slide 27 text
Thanks!