Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Ankoでコンポーネント指向
Search
Keita Kagurazaka
December 13, 2016
Programming
8.4k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Ankoでコンポーネント指向
第4回Kotlin勉強会 (
https://connpass.com/event/44710/
) で発表した資料です。
Keita Kagurazaka
December 13, 2016
More Decks by Keita Kagurazaka
See All by Keita Kagurazaka
三者三様 宣言的UI
kkagurazaka
0
550
SELECT FOR UPDATEの話
kkagurazaka
0
510
Mobileアプリのアーキテクチャ設計法
kkagurazaka
2
1.5k
原理から完全理解するDagger Hilt Migration
kkagurazaka
1
2k
今後のJetpackでAndroid開発はこう変わる!
kkagurazaka
16
6.4k
外部SDKのViewにマスク処理をする方法と罠
kkagurazaka
0
1.1k
AWAのフルリニューアルを支えたアーキテクチャ
kkagurazaka
1
970
CQRS Architecture on Android
kkagurazaka
7
3.2k
suspending functionの裏側
kkagurazaka
3
480
Other Decks in Programming
See All in Programming
ここ半年くらいでAIに作らせたR用ツール
eitsupi
0
370
夏だ!祭りだ!祭りとはドメインモデリングでは?
ryugen04
0
190
プロポーザルを書いてもらう
pvcresin
0
290
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
1.7k
AIが無かった頃の素敵な出会いの話
codmoninc
1
390
Claude Code全社展開のためにやったことn選~プラグイン302個・コミッター271人を支えるために~
kenchan
5
1.4k
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
550
AI時代のPHPer生存戦略 ~「言語、もうなんでもよくない?」に本気で向き合う~
vivion
0
300
Laravel Boostに学ぶ、AIにPHPを書かせる技術 〜OSSの実装から蒸留するエージェント制御の王道〜
kentaroutakeda
3
670
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
mfunaki
0
130
AWS DevOps AgentのAzure接続機能を検証して見えた活用法/Use Cases Verified for the AWS DevOps Agent's Azure Connectivity Feature
masakiokuda
1
220
言語を使う側から、作る側へ。 自作 Lisp で得た新たな気づき。
andpad
0
160
Featured
See All Featured
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
119
120k
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
250
Typedesign – Prime Four
hannesfritz
42
3.1k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
480
How STYLIGHT went responsive
nonsquared
100
6.2k
Producing Creativity
orderedlist
PRO
348
40k
The browser strikes back
jonoalderson
0
1.5k
Building an army of robots
kneath
306
46k
Paper Plane
katiecoart
PRO
2
52k
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
360
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
540
Transcript
Ankoでコンポーネント指向 2016/12/13 第4回 Kotlin勉強会 @ Sansan @kkagurazaka
自己紹介 • @kkagurazaka • 普段はC++で画像処理とか • Kotlin lover • 趣味Androider
RxProperty for Android https://github.com/k-kagurazaka/rx-property-android
初LTです
コンポーネント指向 • 近年Webフロント界隈で注目 • プレゼンテーション層のパラダイム
普通のModel-View-Presenter View Presenter • View Template • UI State •
Event Handling • View Controller
普通のModel-View-ViewModel View ViewModel • View Template • Event Handling •
UI State
コンポーネント指向 AllTasksComponent View ViewModel ToolbarComponent View ViewModel TaskListComponent View ViewModel
TaskComponent View ViewModel FABComponent View ViewModel
Reactの場合 UI State Event Handling View Template
なにが嬉しいのか? • 関心の分離 View TemplateとPresentation Logicの分離は「技術による分離」 • カプセル化 1つのコンポーネントに関心事項が収まる •
再利用性 一度定義したコンポーネントは使い回せる
Presentational / Container Component Presentational Container 関心 どう見えるか どう動くか データ読み込み
親コンポーネントから与え られる モデルから取得 データ書き込み 親コンポーネントから与え られるコールバックを呼ぶ モデルのロジックをキック 内部状態 (なるべく)持たない 持つ
Presentational / Container Component Container Presentational Container Presentational Presentational Presentational
Presentational Presentational Presentational
Androidの場合は?
• Container Component ◦ Activity / Fragment ◦ イベントを受けてモデルをキックする、実質Presenter •
Presentational Component ◦ (Custom) View / Composite View ◦ 親から受け取った値を表示するだけ • View Template ◦ layout.xml + DataBinding ◦ <include>でコンポーネントのネストを実現
layout.xml + DataBindingの辛み • XMLそのものが辛い ◦ タイプセーフじゃない ◦ DataBinding周りの補完が不十分 ◦
Javaコードと行ったり来たり • エラーの原因がわかりにくい ◦ Android Studioでうまくエラーメッセージ出ない経験ないですか? • Kotlinとの相性がイマイチ ◦ 大分マシにはなったものの、kaptは問題が起きやすい
None
Anko • KotlinでAndroidアプリ開発するのに便利な機能たくさん ◦ layout.xmlをKotlin上でDSLとして・・・ ◦ 非同期処理を簡単に・・・ ◦ SQLiteも簡単に・・・ ◦
その他便利なユーティリティ多数 • JetBrains製
Layout DSL • タイプセーフ・nullセーフ • 再利用性が高い • パース時間ゼロ • DataBinding不要
⇒コンポーネント作れる!
やってみよう
None
1. AnkoComponentを継承してLayout DSL
2. 外部とのI/F定義 ダサい・・・
Bound call references (since Kotlin 1.1)
Javaのgetter/setterから自動生成されたプロパティには未対応
気を取り直して・・・
3. DSL内で使える拡張関数を定義 あとは同じようにコンポーネントを作っていくだけ!
まとめ • Ankoを使えばAndroidでもコンポーネント指向はできる • ただし、まだネタ枠 ◦ タブレット対応どうする? ◦ アーキテクチャどうする? ◦
propsのバケツリレーどうする?
Thanks!