如何開發一款以太坊安卓錢包系列3 - 資產信息展示
這是如何開發以太坊（安卓）錢包系列第3篇， 錢包賬號資產信息展示，展示信息主要包括賬號地址、eth余額及該賬號所擁有的Token及余額。
預備知識 MVVM
本文會涉及和UI界面的交互，提前理解下界面和數據如何交互是非常有必要的，如果你已經很熟悉MVVM，可跳過這一小節。
最早寫Android的時候，數據和界面經常耦合在一起，一個Activity文件總是特別大，每當產品界面改版就非常痛苦，吐槽下，很多產品經理都喜歡對界面改來改去。
後來Google 推薦多個架構模式： MPV、 MVVM模式來解決數據和UI耦合的問題，登鏈錢包代碼，使用的就是MVVM模式，所以對它做一個簡單介紹，下面是MVVM的視圖和數據的交互圖：
View 通常對應於Activity/Fragment/自定義View
Model：則是和數據相關的模塊。
View 與 Model 不直接發生聯系， 而是通過ViewModel負責接收View層的事件以及獲取並處理數據，ViewModel層的數據變化也會通知給View層進行相應的UI的更新，從而實現業務邏輯和Ui的隔離。
使用MVVM模式最大的優點就是解耦， 因為數據處理邏輯是獨立於View, 在UI更改時，ViewModel 不用做太多改動。
我們使用了Google在I/O大會推出的一套遵循MVVM開發模式的LiveData和ViewModel組件架構。
ViewModel 和 LiveData
ViewModel 會關註UI生命周期來存儲和管理數據，在Activity發生變化（鎖屏開屏、旋轉）時，ViewModel 會自動保留之前的數據並給新的Activity或Fragment使用，當界面被系統銷毀時，ViewModel也會進行資源清理，避免內存泄漏。
ViewModel 還可以用於不同界面間數據共享。
LiveData是一個可觀察的數據持有者類。觀察者可以方便我們以異步的方式獲取數據，同時LiveData也是有生命周期感知的。如果其生命周期處於STARTED或RESUMED狀態。LiveData會將觀察者視為活動狀態，並通知其數據的變化。LiveData未註冊的觀察對象以及非活動觀察者是不會收到有關更新的通知。
了解更多，可自行以關鍵字： Lifecycle、ViewModel、LiveData 進行搜索。
賬號信息展示
展示信息主要包括賬號地址、eth余額及該賬號所擁有的Token及余額， 其界面效果如下:
這個界面應的是登鏈錢包的
PropertyFragment，上圖的UPT 是我自己發行的Token，所以沒有顯示價格
現在我們來思考一下， 怎麽來展現上面的數據， 別著急往下看， 可以先想想。
先對問題做一個拆分，把數據拆分為4個部分：
- 顯示當前選中的賬號
- 顯示當前賬號 ETH 余額
- 顯示當前賬號下 Token 數量
- 顯示對應的法幣金額。
為了避免 UI 與上面4個數據的耦合，代碼使用了一個TokensViewModel， 獲取到的數據用 LiveData做了一個Wrap，以便UI可以訂閱數據，TokensViewModel類像下面，代碼有刪減：
public class TokensViewModel extends ViewModel {
private final MutableLiveData<ETHWallet> defaultWallet;
private final MutableLiveData<NetworkInfo> defaultNetwork;
private final MutableLiveData<Token[]> tokens;
private final MutableLiveData<Ticker> prices;
}
MutableLiveData 是前面提到的 LiveData的子類，在UI界面中就可以對數據進行訂閱，下面我們逐一拆解下每個數據。
顯示當前賬號
可以分為兩個步驟：
- 從數據庫中讀取賬號；
- 界面顯示賬號
TokensViewModel中定義了一個MutableLiveData<ETHWallet> defaultWallet ，從數據庫中讀取賬號會保存在defaultWallet中，然後UI對 defaultWallet 進行觀察顯示。
註解: 登鏈錢包 裏大量使用的這個方式，通過一個LiveData 做數據橋接。
在上一篇導入賬號及賬號管理，所有的賬號使用greenDao 存儲起來， 因此我們只需要把所有賬號從加載出來，挑選出當前選中的那一個。 結合代碼看一看：
// WalletDaoUtils.java
public static ETHWallet getCurrent() {
List<ETHWallet> ethWallets = ethWalletDao.loadAll();
for (ETHWallet ethwallet : ethWallets) {
if (ethwallet.isCurrent()) {
ethwallet.setCurrent(true);
return ethwallet;
}
}
return null;
}上面代碼先用 ETHWalletDao.loadAll 加載出所有的賬號，返回當前選中的，上面的代碼會被FetchWalletInteract 類的 findDefault方法調用，在ViewModle裏，很多時候以數據進行交互的類，我們會命名為 xxxInteract，這也是一個習慣用法。
其代碼如下：
// FetchWalletInteract.java
// 返回一個可訂閱的Single<ETHWallet> 對象
public Single<ETHWallet> findDefault() {
return Single.fromCallable(() -> {
return WalletDaoUtils.getCurrent();
}).subscribe(this::onDefaultWallet);
}
// 獲取到默認錢包賬號 設置到 defaultWallet 這個LiveData
private void onDefaultWallet(ETHWallet wallet) {
defaultWallet.setValue(wallet);
}findDefault()返回一個可訂閱的Single
之後，在UI界面PropertyFragment.java 中， 就可以對 defaultWallet 進行訂閱：
tokensViewModel.defaultWallet().observe(this, this::showWallet);當獲取到默認賬號時，就會回調showWallet:
// UI 顯示
public void showWallet(ETHWallet wallet) {
tvWalletName.setText(wallet.getName());
tvWalletAddress.setText(wallet.getAddress());
}這樣， 界面的顯示就完成了，下一篇繼續介紹獲取余額。
參考文檔
- lifecycle官方文檔地址
- RxAndroid 了解更多響應式編程
我創建了一個專門討論錢包開發的微信群，加微信：xlbxiong 備註：錢包。
加入知識星球，和一群優秀的區塊鏈從業者一起學習。
深入淺出區塊鏈 - 系統學習區塊鏈，學區塊鏈的都在這裏，打造最好的區塊鏈技術博客。
本文原文鏈接
如何開發一款以太坊安卓錢包系列3 - 資產信息展示