Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Ankoでコンポーネント指向
Search
Keita Kagurazaka
December 13, 2016
Programming
8.5k
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
620
SELECT FOR UPDATEの話
kkagurazaka
0
550
Mobileアプリのアーキテクチャ設計法
kkagurazaka
2
1.5k
原理から完全理解するDagger Hilt Migration
kkagurazaka
1
2k
今後のJetpackでAndroid開発はこう変わる!
kkagurazaka
16
6.5k
外部SDKのViewにマスク処理をする方法と罠
kkagurazaka
0
1.1k
AWAのフルリニューアルを支えたアーキテクチャ
kkagurazaka
1
990
CQRS Architecture on Android
kkagurazaka
7
3.3k
suspending functionの裏側
kkagurazaka
3
490
Other Decks in Programming
See All in Programming
そのデザイントークン、Flutterでも同じ見た目になりますか?
nakamizu
0
290
React Native에 현대적인 빌드 도구 더하기: Rollipop 구현기
leegeunhyeok
0
180
クラウドゲーミングのパフォーマンス最適化に挑む / Cloud Gaming Performance Tuning
vivion
0
320
作って学ぶSpring BootのAuto Configuration / JJUG Night Seminar 2026-10-19
rshindo
0
220
[Dev Group Paris Octobre 26] Agentforce, SIforce, Claudeforce, Slackbot… on s'y retrouve ?
nabondance
0
130
graphql-ruby を Spinel で速くしようとした話
mtsmfm
0
140
DroidKnights 2026 Android A2UI Jetpack Compose 기반의 안전한 AI UI 렌더링 - 박제창
itsmedreamwalker
1
140
クラウドエージェントは、 何がそんなに便利なのか / what makes cloud agents so useful
rkaga
5
690
Vue.jsで作る空間解析アプリとCapacitorプラグインのData Bridge
hal_spidernight
1
160
Kotlinize Is Not Just Converting to Kotlin
chigichan24
1
220
Getting Started with Vibe Coding
miccheng
0
180
느린 네트워크와 저사양 디바이스 사용자를 위한 웹뷰 로딩 시간 개선기
kmkim
1
170
Featured
See All Featured
WENDY [Excerpt]
tessaabrams
14
40k
Building a Scalable Design System with Sketch
lauravandoore
464
34k
Technical Leadership for Architectural Decision Making
baasie
3
630
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
380
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.9k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Building the Perfect Custom Keyboard
takai
2
940
The World Runs on Bad Software
bkeepers
PRO
72
12k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
790
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
510
Building an army of robots
kneath
307
47k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.9k
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!