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
ViewModel使ってますか?
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
katsuki-nakatani
April 26, 2018
Technology
330
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ViewModel使ってますか?
メルカリさん、ヤフーさん主催のMixLeapでLTしたときの資料です。
AndroidのViewModelのさわりの説明というかんじです
katsuki-nakatani
April 26, 2018
More Decks by katsuki-nakatani
See All by katsuki-nakatani
Android 10 対応 Tips
katsukinakatani
0
120
InAppUpdate実装&InAppBillingClientVer2.0実装例
katsukinakatani
0
610
AndroidJetpack概要 &旧AACの紹介
katsukinakatani
0
710
デフォルトアプリとパーミッション
katsukinakatani
0
230
Target SDK Version 26に上げる時につまづいたこと
katsukinakatani
3
2.9k
Whats new android wear (umeda.apk #3 LT)
katsukinakatani
1
510
Android 7.1.1 AppShortcuts setup(DevfestKansai Lightning Talk)
katsukinakatani
1
710
Firebase Authentication & Firebase Realtime Database setup
katsukinakatani
2
910
Firebase Setup for Android Studio2.2
katsukinakatani
1
640
Other Decks in Technology
See All in Technology
2026年6月23日 Syncable Tech + Start Python Club にて
hamukazu
0
150
AIチャット検索改善の3週間
kworkdev
PRO
2
170
“詰む”前に仕組みを作れ 〜技術の波に溺れないためのキャッチアップ術〜
takasyou
7
3.7k
10年間のブログ発信を振り返って見えたWebアプリケーションエンジニアとしての軌跡
stefafafan
0
180
【セミナー資料】Claude Code をセキュアに使うための考え方と設定の勘どころ / Claude Code Webinar 20260616
masahirokawahara
2
460
いまさら聞けない「仕様駆動開発入門」 〜AI活用時代の開発プロセスを考える〜
findy_eventslides
2
200
週末にループ・エンジニアリングの理解を深めるためのスライド
nagatsu
0
110
アラート調査向けAIエージェントの本番導入とその後/AI Agents for Alert Investigation: Production Deployment and After
taddy_919
0
110
5分でわかるDuckDB Quack
chanyou0311
3
250
【2026年版】 ベクトル検索とEmbedding最前線
mocobeta
23
7.5k
PostgreSQL 19 新機能概要 OSC Hokkaido 2026
nori_shinoda
0
240
GitHub Copilot 最新アップデート – 「一歩先」の実践活用術
moulongzhang
5
1.7k
Featured
See All Featured
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
490
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
750
Google's AI Overviews - The New Search
badams
0
1k
Scaling GitHub
holman
464
140k
Between Models and Reality
mayunak
4
350
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
Thoughts on Productivity
jonyablonski
76
5.2k
What does AI have to do with Human Rights?
axbom
PRO
1
2.2k
Building the Perfect Custom Keyboard
takai
2
800
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
170
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
210
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
210
Transcript
ViewModel使ってますか? 2018/4/20 Osaka Mix Leap Study #11 - スマホアプリ勉強会
Speaker 中谷 克紀 仕事 Enterprise Server Engineer GDG 神戸スタッフ Twitter @KatsukiNakatani
What's ViewModel? MVVMとか設計の話ではないです
これの話
ViewPagerでこんなデータを表示したい 仮想通貨のデータ 最近、仮想通貨流行ってますよね?
データの持ち方 data class CurrencyOrder( var exchanger: String? = null, //購入Exchanger
var folio_group:Long = FolioGroup.DEFAULT_ID, //この通貨のグループ var currency_pair: String? = null, //通貨ペア var proc_date: String = LocalDate.now().format(DateTimeFormatter.ofPattern("yyyy/MM/dd")), //処理日付 var amount: Double = 0.toDouble(), //処理数量 var price: Double = 0.toDouble() //ベースとなる通貨の価格 exchanger folio_group currency_pair proc_date amount price zaif 1 jpy_btc 2018/1/1 1 850000 zaif 2 jpy_xem 2018/2/2 1 35
データの概要 folio_groupがここ
安易に考える Activity ViewPager Pager1 Fragment Pager2 Fragment ActivityViewModel FragmentViewModel FragmentViewModel
安易に考える Activity ViewPager Pager1 Fragment Pager2 Fragment ActivityViewModel 1.ActivityViewModelがデータを全件取得 2.ActivityがそのデータをDataCallbackInterfaceを
実装しているであろう Fragmentに送る 3.FragmentがCallbackを受け取り、データを表示 FragmentViewModel FragmentViewModel DataCallback DataCallback
めんどくさい Activity ViewPager Pager1 Fragment Pager2 Fragment ActivityViewModel ・ActivityがDataCallbackInterfaceを実装していることを知る必要あり ・ActivityはただViewPagerだけ管理していたい
FragmentViewModel FragmentViewModel DataCallback DataCallback
ViewModelの登場 ViewModelのインスタンス生成時に渡すparameterに 紐付いて生存期間のスコープが作成されます ViewModelProviders.of(parameter).get(MyViewModel.class); 画面回転時にデータ保存を意識しなくても良い!! ※ただし低メモリ時に破棄されると困るデータはきちんと SaveInstanceStateで保存しましょう
ViewModelの共有 ViewModelのインスタンス生成時に渡すparameterが同じものは別インスタンスじゃなくて 同じインスタンスにアクセスできる ViewPager Fragment Code viewModel = ViewModelProviders.of(activity).get(AssetsViewModel::class.java) Activity
ViewPager Pager1 Fragment Pager2 Fragment getActivity()した結果は同じActivity
諸問題が解決 Activity ViewPager Pager1 Fragment Pager2 Fragment ActivityViewModel AssetViewModel DataCallback
DataCallback ・DataCallbackを用意しなくても良くなり、 ActivityがFragmentの実装を意識しなくて良くなった ・Activityの回転時に再度データを検索、表示するような実装を意識しなくても良くなった
ViewModelの作り方 class AssetsViewModel @Inject constructor(private val database: AppDatabase, private val
messageRepository: MessageRepository, private val assetRepository: AssetsRepository, private val preferenceRepository: PreferenceRepository) : ViewModel() Architecture ComponentのViewModelを継承する
注意すること 生存期間が渡したパラメータのライフサイクルより長い = ViewModel側でViewにアクセスする、またはライフサイクル内の コンテキストを使用するような実装は避けましょう contextがほしいViewModelの場合はAndroidViewModelを 継承してください
ViewModelはLiveDataと組み合わせると便利 LiveDataの特徴 SubscribeするとActivityやFragmentのライフサイクル状態を 見てコールバックを呼び出してくれる LiveDataの定義 var assetsList: MutableLiveData<AssetsResponse> = MutableLiveData()
LiveDataへデータのプッシュ assetsList.postValue(response) viewModel.assetsList.observe(this,Observer<AssetsResponse> { it -> //表示処理}) LiveDataのオブザーブ ViewModel Fragment
よくある通信例 1.画面を開くと外部通信を行う 2.外部通信を行っている場合はProgressが表示される 3.通信を行っている間に画面が回転する可能性もある 4.通信結果を画面に表示する、ただし画面を落としている可能性もあるよね 落としている時はデータ表示処理してほしくないし復帰したら処理してほしい
よくある通信例 1.画面を開くと外部通信を行う 2.外部通信を行っている場合はProgressが表示される 3.通信を行っている間に画面が回転する可能性もある 4.通信結果を画面に表示する、ただし画面を落としている可能性もある 落としている時はデータ表示処理してほしくないし復帰したら処理してほしい ー>ViewModelにbooleanを持ってDatabindingで表示・非表示を切り替え ー>ViewModelを使えば渡すContextより長いスコープで 生存してくれるので気にしなくて良い ー>LiveDataをViewModel内に持たせておけば、回転してもデータを維持しUI復帰時に
データをPostしてコールバックしてくれる
使ってみた https://goo.gl/NB9R7y 結果・Room+ViewModel+LiveDataを使って実装してみたのでよければ使ってください。 Architecture Componentのモジュールを使うと 今まで苦労していたAndroidのライフサイクル関係は 大分楽に実装できます
おしまい 御清聴ありがとうございました