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
AndroidDevSummit2022
Search
shinsuke-fujita
November 29, 2022
Programming
0
1.3k
AndroidDevSummit2022
From Views to Composeのまとめと実践
shinsuke-fujita
November 29, 2022
Tweet
Share
More Decks by shinsuke-fujita
See All by shinsuke-fujita
GoogleI/O2024 LT報告会資料
shinsukefujita1126
1
500
GoogleI/O2023 LT報告会資料
shinsukefujita1126
0
860
KMMで始めるマルチプラットフォーム開発
shinsukefujita1126
0
250
GoogleI/O2022 LT報告会資料
shinsukefujita1126
0
1.6k
Other Decks in Programming
See All in Programming
Grafana Loki によるサーバログのコスト削減
mot_techtalk
1
110
Compose でデザインと実装の差異を減らすための取り組み
oidy
1
300
Kanzawa.rbのLT大会を支える技術の裏側を変更する Ruby on Rails + Litestream 編
muryoimpl
0
220
Linux && Docker 研修/Linux && Docker training
forrep
23
4.5k
Open source software: how to live long and go far
gaelvaroquaux
0
620
How mixi2 Uses TiDB for SNS Scalability and Performance
kanmo
29
11k
Immutable ActiveRecord
megane42
0
130
Unity Android XR入門
sakutama_11
0
140
[JAWS-UG横浜 #79] re:Invent 2024 の DB アップデートは Multi-Region!
maroon1st
1
140
2024年のkintone API振り返りと2025年 / kintone API look back in 2024
tasshi
0
210
動作確認やテストで漏れがちな観点3選
starfish719
6
1k
Kubernetes History Inspector(KHI)を触ってみた
bells17
0
200
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Pragmatic Product Professional
lauravandoore
32
6.4k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
540
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
12
950
How STYLIGHT went responsive
nonsquared
98
5.3k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
50k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Into the Great Unknown - MozCon
thekraken
35
1.6k
Transcript
Android Dev Summit ‘22 From Views to Compose: Where can
I start? サイボウズ株式会社 藤⽥真輔(@fujipon1126)
なぜこのセッションを選んだ? • 継続的にJetpack Composeについて学習したい • プロダクトにJetpack Composeを導⼊したい
セッション概要 • 以下のページの内容を説明した感じで、それ以上でもそれ以下 でもない • https://developer.android.com/jetpack/compose/interop/migration- strategy • 既存プロダクトのComposeへの移⾏は3つの戦略で進めると良い 1.
New Features(新機能の作成) 2. Common UI(UIコンポーネントのライブラリ作成) 3. Existing Features(既存機能の置き換え) ※プロダクトの規模などにより適切に対応する
1. New Features(新機能) • Composeを利⽤して新機能を作る場合でも、既存アーキテク チャの制約下で実施する • FragmentとNavigationコンポーネントを利⽤してる場合は、 Fragmentを作成しComposeViewを返す •
新しい機能が既存の画⾯の⼀部になる場合は、他のビューと同 様に、ComposeView を UI 階層に追加する
2. Common UI(UIコンポーネントのライブラリモ ジュール作成) • Compose を使⽤して機能を作成する場合、結果としてコン ポーネントのライブラリを構築することになるはず • モジュールを作成することで、コンポーネントの信頼できる唯
⼀の情報源を保持して、再利⽤性を促進できる • アプリのサイズに応じて、このライブラリは別個のパッケージ、 モジュール、ライブラリ モジュールにすることができる
3. Existing Features(既存機能の置き換え) • 既存機能を段階的に移⾏することが可能 • まずはシンプルな画⾯を置き換え(少量のコードで書き直せる) • ViewとComposeが混在してる画⾯も完全移⾏の有⼒候補 •
複雑さに応じて段階的に移⾏を繰り返し画⾯全体がComposeに なるまで⾏う(ボトムアップアプローチ) • 最終的にUI全てがComposeになると、Fragmentを使⽤するメ リットがほぼ無いので、Composeを利⽤したナビゲーションを 検討する
その他 • 既存のテーマを再利⽤できる • MDC ライブラリを使⽤中→MDC Compose Theme Adapter ライブ
ラリを使⽤ • AppCompatXMLテーマを使⽤中→AppCompat Compose Theme Adapter を使⽤
内容踏まえて実践してみた • サンプルプロジェクトを以下の条件で作成(migration-view-to-compose) SingleActivity & Viewベース & NavigationComponentで画⾯遷移 - MainActivity
- NavigationComponentによる画⾯遷移を提供 - MainFragment - 各サブ画⾯への遷移ボタンがある - Sub1Fragment - Buttonを押すとEditTextに⼊⼒された⽂字をTextViewにコピー - Sub2Fragment - ImageViewとButtonがあって、SeekBarも置いてる - Sub3Fragment - RecyclerViewに50アイテム表⽰
New Featuresの実践 • Sub4画⾯をComposeで作る(Sub4Fragment/Sub4Screen) Sub4Fragment抜粋
Common UIの実践 • common-uiモジュールを作りCommonButtonコンポーザブル を作る(共通ボタン) • appモジュールでcommon-uiの CommonButtonを参照する
Existing Featuresの実践(画⾯の⼀部) • ボタンが複数ある画⾯の⼀部(Sub1ボタン)だけComposeに置 き換える • レイアウト/コード
Existing Featuresの実践(画⾯全体) • RecyclerViewの画⾯をComposeで置き換え View Compose
引⽤元 • From Views to Compose: Where can I start?
- YouTube • Compose をアプリに導⼊する - Android Developers • 移⾏戦略 – Android Developers • fujipon1126/migration-view-to-compose