如何構建 Android MVVM 應用程式

1、概述

• Context
  Context 是幹嘛用的呢，為什麼每個ViewModel都最好需要持了一個Context的引用呢？ViewModel 不做和UI相關的事，不操作控制元件，也不更新UI，那為什麼要有Context呢？原因主要有以下兩點，當然也有其他用處，呼叫工具類、幫助類可能需要context引數等：
  • 通過圖1中，我們發現ViewModel 通過傳參給Model 然後得到一個Observable<Bean>,其實這就是網路請求部分，做網路請求我們必須把Retrofit Service返回的Observable<Bean>繫結到Context的生命週期上，防止在請求回來時Activity已經銷燬等異常，其實這個Context的目的就是把網路請求繫結到當前頁面的生命週期中。
  • 在圖1中，我們可以看到兩個ViewModel 之間的聯絡是通過Messenger來做，這個Messenger 是需要用到Context，這個我們後續會講解。

• Model
  Model 是什麼呢，其實就是資料原型，也就是我們用Json轉過來的Java Bean，我們可能都知道，ViewModel要把資料對映到View中可能需要大量對Model的資料拷貝，拿Model 的欄位去生成對應的ObservableField（我們不會直接拿Model的資料去做展示），這裡其實是有必要在一個ViewModel 保留原始的Model引用，這對於我們是非常有用的，因為可能使用者的某些操作和輸入需要我們去改變資料來源，可能我們需要把一個Bean 從列表頁點選後傳給詳情頁，可能我們需要把這個model 當做表單提交到伺服器。這些都需要我們的ViewModel
  持有相應的model。

• Data Field （資料繫結）
  Data Field 就是需要繫結到控制元件上的ObservableField欄位， 無可厚非這是ViewModel的必須品。這個沒有什麼好說，但是這邊有一個建議：
  這些欄位是可以稍微做一下分類和包裹的，比如說可能一些欄位繫結到控制元件的一些Style屬性上（如果說：長度，顏色，大小）這些根據業務邏輯的變化而動態去更改的，對於著一類針對View Style的的欄位可以宣告一個ViewStyle類包裹起來，這樣整個程式碼邏輯會更清晰一些，不然ViewModel裡面可能欄位氾濫，不易管理和閱讀性較差。而對於其他一些欄位，比如說title，imageUrl，name這些屬於資料來源型別的欄位，這些欄位也叫資料欄位，是和業務邏輯息息相關的，這些欄位可以放在一塊。

• Command （命令繫結）
  Command （命令繫結）說白了就是對事件的處理（下拉重新整理，載入更多，點選，滑動等事件處理），我們之前處理事件是拿到UI控制元件的引用，然後設定Listener，這些Listener 其實就是Command，但是考慮到在一個ViewModel 寫各種Listener 並不美觀，可能實現一個Listener就需要實現多個方法，但是我們可能只想要其中一個有用的方法實現就好了。同時實現Listener 會拿到UI的引用，可能會去做一些和UI相關的事情，這和我們之前說的ViewModel 不持有控制元件的引用，ViewModel不更改UI 有相悖。更重要一點是實現一個Listener 可能需要寫一些UI邏輯才能最終獲取我們想要的，簡單一點的比如說，你想要監聽ListView滑到最底部然後觸發載入更多的事件，這時候你就要在ViewModel裡面寫一個OnScrollListener,然後在裡面的onScroll方法中做計算，計算什麼時候ListView滑動底部了，其實ViewModel的工作並不想去處理這些事件，它專注做的應該是業務邏輯和資料處理，如果有一個東西它不需要你自己去計算是否滑到底部，而是在滑動底部自動觸發一個Command，同時把當前列表的總共的item數量返回給你，方便你通過 page=itemCount/LIMIT+1去計算出應該請求伺服器哪一頁的資料那該多好啊。MVVM Light Toolkit 幫你實現了這一點：

Java

public final ReplyCommand<Integer> onLoadMoreCommand = new ReplyCommand<>((itemCount) -> { int page=itemCount/LIMIT+1; loadData(page.LIMIT) });

1 2 3 4

public final ReplyCommand<Integer> onLoadMoreCommand =  new ReplyCommand<>((itemCount) -> { int page=itemCount/LIMIT+1; loadData(page.LIMIT) });

接著在XML 佈局檔案中通過bind:onLoadMoreCommand繫結上去就行了

Java

<android.support.v7.widget.RecyclerView android:layout_width="match_parent" android:layout_height="match_parent" bind:onLoadMoreCommand="@{viewModel.loadMoreCommand}"/>

1 2 3 4

<android.support.v7.widget.RecyclerView android:layout_width="match_parent"   android:layout_height="match_parent"   bind:onLoadMoreCommand="@{viewModel.loadMoreCommand}"/>

• 具體想了解更多請檢視 MVVM Light Toolkit 使用指南，裡面有比較詳細的講解Command的使用。當然Command並不是必須的，你完全可以依照你的習慣和喜好在ViewModel 寫Listener，不過使用Command 可以使你的ViewModel 更簡潔易讀，你也可以自己定義更多的Command，自己定義其他功能Command，那麼ViewModel的事件處理都是託管ReplyCommand<T>來處理，這樣的程式碼看起來會特別美觀和清晰。

• Child ViewModel （子ViewModel）
  子ViewModel 的概念就是在ViewModel 裡面巢狀其他的ViewModel，這種場景還是很常見的。比如說你一個Activity裡面有兩個Fragment，ViewModel 是以業務劃分的，兩個Fragment做的業務不一樣，自然是由兩個ViewModel來處理，Activity 本身可能就有個ViewModel 來做它自己的業務，這時候Activity的這個ViewModel裡面可能包含了兩個Fragment分別的ViewModel。這就是巢狀的子ViewModel。還有另外一種就是對於AdapterView 如ListView RecyclerView,ViewPager等。

Java

//Child ViewModelpublic final ObservableList<ItemViewModel> itemViewModel = new ObservableArrayList<>();

1 2	//Child ViewModelpublic final ObservableList<ItemViewModel> itemViewModel = new ObservableArrayList<>();

它們的每個Item 其實就對應於一個ViewModel，然後在當前的ViewModel 通過ObservableList<ItemViewModel>持有引用（如上述程式碼），這也是很常見的巢狀的子ViewModel。我們其實還建議，如果一個頁面業務非常複雜，不要把所有邏輯都寫在一個ViewModel，可以把頁面做業務劃分，把不同的業務放到不同的ViewModel，然後整合到一個總的ViewModel，這樣做起來可以使我們的程式碼業務清晰，簡短意賅，也方便後人的維護。

總得來說ViewModel 和View 之前僅僅只有繫結的關係，View層需要的屬性和事件處理都是在xml裡面繫結好了，ViewModel層不會去操作UI，只會運算元據，ViewModel只是根據業務要求處理資料，這些資料自動對映到View層控制元件的屬性上。關於ViewModel類中包含哪些模組和欄位，這個需要開發者自己去衡量，這邊建議ViewModel 不要引入太多的成員變數，成員變數最好只有上面的提到的5種（context、model、…），能不進入其他型別的變數就儘量不要引進來，太多的成員變數對於整個程式碼結構破壞很大，後面維護的人要時刻關心成員變數什麼時候被初始化，什麼時候被清掉，什麼時候被賦值或者改變，一個細節不小心可能就出現潛在的Bug。太多不清晰定義的成員變數又沒有註釋的程式碼是很難維護的。

• ViewModel與Model的協作
  從圖1 中，Model 是通過Retrofit 去獲取網路資料的，返回的資料是一個Observable<Bean>( RxJava ),Model 層其實做的就是這些。那麼ViewModel 做的就是通過傳引數到Model層獲取到網路資料（資料庫同理）然後把Model的部分資料對映到ViewModel的一些欄位（ObservableField），並在ViewModel 保留這個Model的引用,我們來看下這一塊的大致程式碼(程式碼涉及到簡單RxJava，如看不懂可以查閱入門一下)：

• 以上程式碼基本把註釋補全了，基本思路比較清晰，，Rxjava涉及的操作符都是比較基本的，如有不懂，可以稍微去入門，之後的原始碼裡面ViewModel資料邏輯處理都是用Rxjava做，所以需要提前學習一下方便你看懂原始碼。
  

  注：我們推薦使用MVVM 和 RxJava一塊使用，雖然兩者皆有觀察者模式的概念，但是我們RxJava不使用在針對View的監聽，更多是業務資料流的轉換和處理。DataBinding框架其實是專用於View-ViewModel的動態繫結的，它使得我們的ViewModel 只需要關注資料，而RxJava 提供的強大資料流轉換函式剛好可以用來處理ViewModel中的種種資料，得到很好的用武之地，同時加上Lambda表示式結合的鏈式程式設計，使ViewModel 的程式碼非常簡潔同時易讀易懂。

• ViewModel與ViewModel的協作
  在圖 1 中 我們看到兩個ViewModel 之間用一條虛線連線著，中間寫著Messenger，Messenger 可以理解是一個全域性訊息通道，引入messenger最主要的目的就實現ViewModel和ViewModel的通訊，也可以用做View和ViewModel的通訊，但是並不推薦這樣做。ViewModel主要是用來處理業務和資料的，每個ViewModel都有相應的業務職責，但是在業務複雜的情況下，可能存在交叉業務，這時候就需要ViewModel和ViewModel交換資料和通訊，這時候一個全域性的訊息通道就很重要的。關於Messenger 的詳細使用方法可以參照 MVVM Light Toolkit 使用指南的 Messenger 部分,這邊給出一個簡單的例子僅供參考：
  場景是這樣的，你的MainActivity對應一個MainViewModel，MainActivity 裡面除了自己的內容還包含一個Fragment，這個Fragment 的業務處理對應於一個FragmentViewModel,FragmentViewModel請求伺服器並獲取資料，剛好這個資料MainViewModel也需要用到，我們不可能在MainViewModel重新請求資料，這樣不太合理，這時候就需要把資料傳給MainViewModel,那麼應該怎麼傳，彼此沒有引用或者回撥。那麼只能通過全域性的訊息通道Messenger。FragmentViewModel 獲取訊息後通知MainViewModel 並把資料傳給它：

MainViewModel 接收訊息並處理：

在MainActivity onDestroy 取消註冊就行了(不然導致記憶體洩露)

• 當然上面的例子也只是簡單的說明下，Messenger可以用在很多場景，通知，廣播都可以，不一定要傳資料，在一定條件下也可以用在View層和ViewModel 上的通訊和廣播。運用範圍特別廣，需要開發者結合實際的業務中去做更深層次的挖掘。

4、總結和原始碼

• 本篇博文講解主要是一些個人開發過程中總結的Android MVVM構建思想，更多是理論上各個模組如何分工，程式碼如何設計，雖然現在業界使用Android MVVM模式開發還比較少，但是隨著DataBinding 1.0 的釋出，相信在Android MVVM 這塊領域會更多的人來嘗試，剛好最近用MVVM開發了一段時間，有點心得，寫出來僅供參考。
• 文中講解的過程程式碼比較少，程式碼用到了自己開發的一個MVVM Light Toolkit 庫，而且還是RxJava + Lambda 的程式碼，估計很多人看著都暈菜了，這邊會把原始碼公佈出來。如果你還沒有嘗試過用RxJava+Retrofit+DataBinding 構建Android MVVM 應用程式，那麼你可以試著看一下這邊的原始碼並且做一下嘗試，說不定你會喜歡上這樣的開發框架。
• 關於MVVM Light Toolkit 只是一個工具庫，主要目的是更快捷方便的構建Android MVVM應用程式，在裡面新增了一些控制元件額外屬性和做了一些事件的封裝，同時引進了全域性訊息通道Messenger，用起來確實非常方便，你可以嘗試一下，當然還有不少地方沒有完善和優化，後續也會不斷更新和優化，如果不能達到你的業務需求時，你也可以自己新增自己需要的屬性和事件。如果想更深入瞭解MVVM Light Toolkit 請看我這篇博文 MVVM Light Toolkit 使用指南
• 原始碼地址 https://github.com/Kelin-Hong/MVVMLight
  • library —> library是MVVM Light Toolkit 的原始碼，原始碼很簡單，感興趣的同學可以看看，沒什麼多少的技術難度,可以根據自己的需求，新增更多的控制元件的屬性和事件繫結。
  • sample —> 本文涉及的程式碼均處出於這個專案，sample 一個知乎日報的App的簡單實現，程式碼包含了一大部分 MVVM Light Toolkit 的使用場景，（Data、Command、Messenger均有涉及），同時sample嚴格按照博文闡述的MVVM的設計思想開發的，對理解本文有很大的幫助，歡迎clone下來看看。
    Sample 截圖