《安卓-深入淺出MVVM教程》之應用篇

標籤：https   其他   優雅   lse   private   建立   註冊   綁定   bin   

背景

這幾年 MVP 架構在安卓屆非常流行，幾乎已經成為主流架構，它讓商務邏輯 和 UI操作相對獨立，使得代碼結構更清晰。

MVVM 在前端火得一塌糊塗，而在安卓這邊卻基本沒見到幾個人在用，看到介紹 MVVM 也最多是講 DataBinding 或 介紹思想的。偶爾看到幾篇提到應用的，還是對Google官網的Architecture Components 文章的翻譯。

相信大家看別人部落格或官方文檔的時候，總會碰到一些坑。要麼入門教程寫得太複雜（無力吐槽，前面寫一堆原理，各種高大上的圖，然並卵，到實踐部分一筆帶過，你確定真的是入門教程嗎）。要麼就是簡單得就是一個 hello world，然後就沒有下文了（看了想罵人）。

實在看不下去的我，決定插手你的人生。

目錄

《安卓-深入淺出MVVM教程》大致分兩部分：應用篇、原理篇。
採用循序漸進方式，內容深入淺出，符合人類學習規律，希望大家用最少時間掌握 MVVM。

應用篇：
01 Hello MVVM (快速入門)
02 Repository （資料倉儲）
03 Cache （本機快取）
04 State Lcee （載入/空/錯誤/內容視圖）
05 Simple Data Source （簡單的資料來源）
06 Load More （載入更多）
07 DataBinding （資料與視圖綁定）
08 RxJava2
09 Dragger2
10 Abstract （抽象）
11 Demo （例子）
12-n 待定（歡迎 github 提建議）
原理篇
01 MyLiveData（最簡單的LiveData）
02-n 待定（並不是解讀源碼，那樣太無聊了，打算帶你從0擼一個 Architecture）
關於提問

本人水平和精力有限，如果有大佬發現哪裡寫錯了或有好的建議，歡迎在本教程附帶的 github倉庫 提issue。
What？為什麼不在部落格留言？考慮到國內轉載基本無視著作權的情況，一般來說你都不是在源出處看到這篇文章，所以留言我也一般是看不到的。
前言

快一年沒更新安卓技術棧了，今年年初就發現Google正在推 Architecture 。這是Google推出的快速實現 MVVM 架構的類庫。目前已經是RC版本了，正式版應該不遠了。體驗完這麼一個架構之後，只能用一個字形容。

雖然不打算長久的做安卓開發，但在其位謀其職，考慮到安卓社區的發展，有必要給大家漲漲姿勢。

思想

什麼是 MVVM？

很簡單， Model（資料） View（視圖） ViewModel（資料檢視管理器）

能不能具體點？

Model：bean(實體類)、Data Source（Http請求相關、資料庫相關）
View：xml、View、Activity、Fragment 等UI相關
ViewModel：這正是我要說的，先簡單理解為管理器

執行流程

ViewModel 負責調用 Model（可以稱之為資料來源），拿到結果後，更新自身。而 View 與 ViewModel 雙向繫結（後面會講怎麼實現綁定的），所以 View 就會自動更新。
這就是 MVVM 大致的思想。

環境配置

首先需要引入 Lifecycles, LiveData and ViewModel 這三個全家桶，而這些庫是放在Google maven 上，所以你得在項目根 gradle 檔案中加上Google maven

allprojects {
repositories {
jcenter()
maven { url ‘https://maven.google.com‘ }
}
}
然後在 app 模組的 gradle 檔案中加上如下 3 個庫，為了便於後面正式版發布後修改版本號碼，我們通過引用變數。

// Lifecycles, LiveData and ViewModel
compile "android.arch.lifecycle:runtime:$rootProject.lifecycleRuntime"
compile "android.arch.lifecycle:extensions:$rootProject.lifecycle"
annotationProcessor "android.arch.lifecycle:compiler:$rootProject.lifecycle"
相應的，你需要在根 gradle 檔案中加上附加屬性（gradle 的文法）

ext {
lifecycle = ‘1.0.0-rc1‘
lifecycleRuntime = ‘1.0.3‘
}
Model

為了降低學習難度，打算寫一個展示使用者 id 和 name 的demo。
所以 bean 真的是簡單得只有2個屬性，省略了 get 和 set 方法（讀者練習時自己加上）。

public class User implements Serializable {
private int id;
private String name;
// ...getter setter and toString...
}
Model 就寫完了，what？說好的資料來源呢？
慌，不要慌！下次再講。

View

所以相應的，我們定義 2 個 TextView 來展示 id 和 name。

a_activity_user.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:id="@+id/v_root"
br/>xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:id="@+id/v_root"
android:layout_width="match_parent"
android:layout_height="match_parent">

 <TextView     android:id="@+id/tv_id"     android:gravity="center"     android:layout_width="match_parent"     android:layout_height="wrap_content" /> <TextView     android:id="@+id/tv_name"     android:gravity="center"     android:layout_width="match_parent"     android:layout_height="wrap_content" />

</LinearLayout>
然後在 Activity 中初始化並獲得引用。
這裡需要注意，如果你的 support lib >= 26.0.0，則直接繼承 AppCompatActivity 就好。否則需要繼承 LifecycleActivity。

public class UserActivity extends AppCompatActivity {
private TextView tvId;
private TextView tvName;

 @Override protected void onCreate(@Nullable Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     setContentView(R.layout.a_activity_user);     initView();     initData(); } private void initView() {     tvId = (TextView) findViewById(R.id.tv_id);     tvName = (TextView) findViewById(R.id.tv_name); } private void initData() {     // todo }

}
Lifecycle

上面提到 LifecycleActivity，實際上還有 LifecycleFragment，類似的，在 support lib >= 26.0.0 時，預設的 Activity 和 Fragment 基類裡面已經整合了，不需要你做修改了。具體可以看官方文檔 Lifecycle

用於管理 Activity / Freagment 生命週期，方便查詢當前組件生命週期的狀態。對應的關係如。

那到底有什麼用？

只要持有 Lifecycle，就等於知道了容器的生命週期。
比如，實現 LifecycleObserver 之後，就可以在狀態發生改變時及時響應。也就是等同於讓 Model或其他也擁有了生命週期。（還有這種操作？）

定義一個定位監聽器，可以在生命週期不同狀態下，做對應的操作，再也不用在 Activity 中加生命週期註冊或取消操作了。

class MyLocationListener implements LifecycleObserver {
private boolean enabled = false;
public MyLocationListener(Context context, Lifecycle lifecycle, Callback callback) {
...
}

 @OnLifecycleEvent(Lifecycle.Event.ON_START) void start() {     if (enabled) {        // connect     } } public void enable() {     enabled = true;     if (lifecycle.getState().isAtLeast(STARTED)) {         // connect if not connected     } } @OnLifecycleEvent(Lifecycle.Event.ON_STOP) void stop() {     // disconnect if connected }

}
而在 Activity 中，只需要傳入 lifecycle 就可以了。優雅得不像話。

myLocationListener = new MyLocationListener(this, getLifecycle(), location -> {
// update UI
});
ViewModel

ViewModel 就類似於 MVP 中的 Presenter 或者 MVC 中的 Controller。（不清楚什麼是 MVC MVP 也沒關係，就是個概念而已）

現在我們完全沒有必要自己定義 ViewModel 來管理 UI 生命週期，Google大禮包中就有 ViewModel

所以很自然的我們寫出這樣的一個類。

public class UserViewModel extends ViewModel {}
你可能好奇 ViewModel，點進去看發現就是只有一個空方法的抽象類別。可以，這很Google。但從 onCleared 這方法名可以看出，這還是有用處的。

LiveData

接下來就是要去調用 Model 並和 View 綁定，在繼續往下講之前，還需要介紹一下 LiveData，沒錯，就是它，可以輕鬆的實現和 View 的綁定。

它能自動響應生命週期方法，可被觀察（資料改變時通知觀察者），所以可以實現 Model 和 View 的綁定。

具有以下優點：

避免記憶體泄露：由於 Observer 和 Lifecycle 綁定，當 Lifecycle 被銷毀後，Observer 自動被清理。
避免崩潰：避免在 Activity 被銷毀後更新資料導致的崩潰情況
資料可共用：資料可在多個 fragment 中共用。甚至可以通過單例的 LiveData 實現全域資料共用
不需要在 Activity 中處理生命週期
資料更新及時：當資料在 UI 不可見的時更新了，在可見時，資料會及時更新到UI上

具體用法

建立一個可變的 LiveData，也就是 MutableLiveData。
並通過一個方法返回。沒錯，就是這麼簡單，只需要 new 出來就行了。

// Create a LiveData with a String
private MutableLiveData<String> mCurrentName;

public MutableLiveData<String> getCurrentName() {
if (mCurrentName == null) {
mCurrentName = new MutableLiveData<String>();
}
return mCurrentName;
}
在 Activity / Fragment 中 觀察 LiveData。也就是當 LiveData 資料發生變化時，自動回調方法來更新 UI。

final Observer<String> nameObserver = new Observer<String>() {br/>@Override
// Update the UI, in this case, a TextView.
mNameTextView.setText(newName);
}
};
getCurrentName().observe(this, nameObserver);
那什麼時候會更新資料？

更新資料一般是 UI 這邊觸發的，比如我們給按鈕綁定一個事件，點擊之後去更改 name。

mButton.setOnClickListener(new OnClickListener() {br/>@Override
String anotherName = "John Doe";
getCurrentName().setValue(anotherName);
}
});
是的，你想更新 UI 上的文本，只需要修改 LiveData 中的資料即可。

ViewModel + LiveData

講完 LiveData，我們回到 ViewModel。
為了顯示 id 和 name，我們需要一個 LiveData。
對外公開一個 getUser 方法 和 setUsername 方法。
這裡你會發現 getUser 並不是安全執行緒的，因為這個案例不會有在多線程中 getUser，所以沒必要加，實際上還可以把 user 初始化放到成員變數定義的地方。

public class UserViewModel extends ViewModel {
private MutableLiveData<User> user;

 public LiveData<User> getUser() {     if (user == null)         user = new MutableLiveData<>();     return user; } public void setUsername(String username) {     user.setValue(new User(1, username)); }

}
View 和 ViewModel 綁定

之前提到了 LiveData，它可以方便的被觀察。
還有 ViewModel，可以自動響應生命週期。
所以就是這兩個東西，方便的實現綁定操作。

之前我已經初始化了 UserActivity 的View，現在來完善 initData。

通常來說，一個 View 只和一個 ViewModel 綁定。所以我們需要一個 Activity 層級的單例 ViewModel，我們可以通過 ViewModelProviders.of(this).get(UserViewModel.class) 來簡單的實現。

然後通過 userViewModel 取得 LiveData 並添加監聽（綁定操作）。

這個回調方法裡面，我們就可以更新與該資料相關的 UI。

沒錯，綁定就是這麼簡單便捷。

private UserViewModel userViewModel;

private void initData() {
userViewModel = ViewModelProviders.of(this).get(UserViewModel.class);
userViewModel.getUser().observe(this, new Observer<User>() {br/>@Override
updateView(user);
}
});

 userViewModel.setUsername("ittianyu");

}

private void updateView(User user) {
tvId.setText(user.getId() + "");
tvName.setText(user.getName());
}
總結

有了這樣一個構架，以後就不需要為 n 處都要修改 View 導致的複雜的 UI 邏輯而頭疼了。

而資料請求也可以更純粹，不需要管 UI 是怎麼顯示的。

簡單來說就是 請求資料完成並更新資料後，通過通知 UI 去根據資料來渲染介面。

沒錯，今後安卓也可以像前端那樣愉快的寫 UI 了。也可以像後端那樣層次分明的專心處理資料了，妙不可言。

《安卓-深入淺出MVVM教程》之應用篇