從 0 到 1,帶你解剖 MVP 的神祕之處,並自己動手實現 MVP !

JD-CP發表於2018-08-16

Android架構設計之一:MVP

對於新入門或者以及有過一段開發經驗對 MVP 仍有困惑的 Android 開發者,這篇文章,希望你不要錯過。

本文主要講解了最基礎 MVP ,從 0 到 1 的實現過程,以及如何解決實現過程中遇到的問題。

簡介

關於 Android 架構,目前主要有 MVC、MVP、MVVM、模組化、元件化等。

1. MVC : Model - View - Controller

M:邏輯模型,V:檢視模型,C:控制器

但這種架構,相較於其他幾種,比較落後。 而且耦合性嚴重,

職責相對不夠明確不利於後期維護,

適用於小型的一次性專案。

2. MVP : Model - View - Presenter

Model:包含具體的資料來源以及資料請求

View:負責 UI 處理,對應 Activity、Fragment

Presenter:負責收取 View 發起的操作指令,並根據指令呼叫 Model 方法,

獲取資料, 並對獲取的資料進行整合,再回撥給 View。

目前 MVP 是應用比較廣泛的一種架構,

層次清晰,耦合度降低,同時 View 只負責 UI 即可,釋放了 View。

但是,在加入 Presenter 作為 View 和 Model 的橋樑的同時,

也導致了 Presenter 會越來越臃腫,也不利於後期的維護。

並且,每一個包含網路請求的 View 都需要對應一個或多個 Presenter。

3. MVVM: Model - View - ViewModel

相對來說,MVVM 實際上是 MVP 的改進版,

將 Presenter 改為 ViewModel,並配合 Databinding,

通過雙向資料繫結來實現檢視與資料的互動。

MVVM 目前相較 MVP,應用較少,除錯不夠方便,

架構的實現方式不夠完善,常見的只有 Databinding 框架,

中小型專案不適用用這種架構。但它簡化了開發,資料和檢視只需要繫結一次即可。

4. 模組化:獨立、解耦、可重性

對一系列具有內聚性的業務進行整理,將其與其他業務進行切割、拆分,

從主工程或者原位置抽離為一個相對獨立的部分。

不同的模組之間,相互獨立,不存在依賴與被依賴的關係。大大減少了耦合度。

既可以以 Library 的形式供主工程依賴,又可以以 Application 的形式,

脫離主工程獨立執行,獨立除錯。這樣就i使得在以後的版本維護及迭代中,

各個業務線的開發人員的職責更加明確。

各個模組之間還可以組合執行,能夠及時適應產品的需求,靈活拆分組合打包上線。

目前應用較多的框架主要有:

阿里的 ARouter

得到開源的 DDComponentForAndroid

5. 元件化

將通用的一個功能或 UI 庫做成一個元件。

比如及時通訊、支付、分享、推送、下拉重新整理等。

模組化是根據業務抽離,元件化是根據功能 UI 抽離。

一個模組可以依賴多個元件,元件與元件之間不可相互依賴。

MVP 具體實現

假設現在有這樣一個需求,在某一個頁面,當使用者點選按鈕,從網路獲取資料並展示在當前頁。

這是一個很簡單的需求,讓我們拆分一下,整理一下實現思路:

  • View:對應某一個頁面,按鈕的點選操作,屬於和使用者的互動
  • Model:對應從網路獲取資料
  • Presenter:負責從 Model 獲取資料,並回撥給 ViewView 拿到資料後進行展示

ok,思路有了,現在用程式碼進行實現:

1. 建立 Model 類,封裝通過網路請求獲取資料的過程,即 M 層

/**
 * model 層:從資料來源(網路、資料庫)獲取資料
 */
public class DataModel {

    private DataApi mApi;

    public DataModel() {
        mApi = RetrofitHelpter.createApi(DataApi.class);
    }

    public void getData(String appKey, Callback<BaseResponse> callback) {
        Call<BaseResponse> responseCall = mApi.getData(appKey);
        // 發起請求
        responseCall.enqueue(callback);
    }

}
複製程式碼

2. 在建立 Presenter 層之前,我們需要建立一個介面,取名 DataView,負責向 V 層回撥資料

public interface DataView {

    void getDataSuccess(List<ArticleBean> articleList);

    void getDataFail(String failMsg);

}
複製程式碼

3. 現在建立 Presenter,取名 DataPresenter

/**
 * 負責 View 層和 Model 層之間的通訊,並對從 Model 層獲取的資料進行處理
 */
public class DataPresenter {

    private DataView mView;
    private DataModel mModel;

    public DataPresenter(DataView dataView) {
        this.mView = dataView;
        this.mModel = new DataModel();
    }

    /**
     * 定義 View 層需要進行的 action
     */
    public void getData(String appKey) {
        mModel.getData(appKey, new Callback<BaseResponse>() {
            @Override
            public void onResponse(Call<BaseResponse> call, Response<BaseResponse> response) {
                mView.getDataSuccess(response.body().getResult().getList());
            }

            @Override
            public void onFailure(Call<BaseResponse> call, Throwable t) {
                mView.getDataFail(t.getMessage());
            }
        });
    }

}
複製程式碼

4. 在我們的 View 層,實現 DataView 介面,並重寫方法,這樣就能接收到回撥資料了

/**
 * View 層,負責 UI 繪製以及與使用者的互動
 */
public class MVPDemoAty extends AppCompatActivity implements DataView {

    private static final String APP_KEY = "dbb6893ab0913b02724696504181fe39";

    private Button btnGet;
    private RecyclerView recyclerView;

    private DataPresenter mPresenter;

    private DataAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_mvp_demo);

        btnGet = findViewById(R.id.btnGet);
        recyclerView = findViewById(R.id.recyclerView);

        recyclerView.setLayoutManager(new LinearLayoutManager(this));

        mPresenter = new DataPresenter(this);

        mAdapter = new DataAdapter(this, new ArrayList<ArticleBean>());
        recyclerView.setAdapter(mAdapter);

        btnGet.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mPresenter.getData(APP_KEY);
            }
        });

    }

    @Override
    public void getDataSuccess(List<ArticleBean> articleList) {
        mAdapter.setNewData(articleList);
    }

    @Override
    public void getDataFail(String failMsg) {
        Toast.makeText(this, failMsg, Toast.LENGTH_SHORT).show();
    }
}
複製程式碼

ok,敲完上面的程式碼,執行專案,點選獲取,就會看到下面的介面:

螢幕截圖

說明我們已經完成了最簡單 MVP 的編寫。

MVP 解決記憶體洩漏

細心的同學可能會發現,我們在 DataPresenter 中持有了 V 層的引用。

這個問題就很嚴重了,如果在獲取網路資料的時候,當前的 Activity 就被銷燬了,那麼就會引起記憶體洩漏。

如何避免呢?解決方法也很簡單,只需要在 Activity 銷燬時,將 V 層的引用置空不就可以了?

ok,思路有了,往下看程式碼實現:

1. 編寫 IPresenter 介面,提供繫結和解綁兩個方法

public interface IPresenter {

    void attach(DataView dataView);

    void detach();

}
複製程式碼

2. DataPresenter 類實現 IPresenter

/**
 * 負責 View 層和 Model 層之間的通訊,並對從 Model 層獲取的資料進行處理
 */
public class DataPresenter implements IPresenter {

    private DataView mView;
    private DataModel mModel;

    public DataPresenter() {
        this.mModel = new DataModel();
    }

    /**
     * 定義 View 層需要進行的 action
     */
    public void getData(String appKey) {
        mModel.getData(appKey, new Callback<BaseResponse>() {
            @Override
            public void onResponse(Call<BaseResponse> call, Response<BaseResponse> response) {
                mView.getDataSuccess(response.body().getResult().getList());
            }

            @Override
            public void onFailure(Call<BaseResponse> call, Throwable t) {
                mView.getDataFail(t.getMessage());
            }
        });
    }

    @Override
    public void attach(DataView dataView) {
        this.mView = dataView;
    }

    @Override
    public void detach() {
        this.mView = null;
    }
}
複製程式碼

3. 在 V 層中,建立 Presenter 完成之後,就繫結mPresenter.attach(this);

並在銷燬時,呼叫 mPresenter.detach(); 修改後的程式碼如下:

/**
 * View 層,負責 UI 繪製以及與使用者的互動
 */
public class MVPDemoAty extends AppCompatActivity implements DataView {

    private static final String APP_KEY = "dbb6893ab0913b02724696504181fe39";

    private Button btnGet;
    private RecyclerView recyclerView;

    private DataPresenter mPresenter;

    private DataAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_mvp_demo);

        btnGet = findViewById(R.id.btnGet);
        recyclerView = findViewById(R.id.recyclerView);

        recyclerView.setLayoutManager(new LinearLayoutManager(this));

        mPresenter = new DataPresenter();
        mPresenter.attach(this);

        mAdapter = new DataAdapter(this, new ArrayList<ArticleBean>());
        recyclerView.setAdapter(mAdapter);

        btnGet.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mPresenter.getData(APP_KEY);
            }
        });

    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        mPresenter.detach();
    }

    @Override
    public void getDataSuccess(List<ArticleBean> articleList) {
        mAdapter.setNewData(articleList);
    }

    @Override
    public void getDataFail(String failMsg) {
        Toast.makeText(this, failMsg, Toast.LENGTH_SHORT).show();
    }
}
複製程式碼

MVP 進一步優化

寫到這裡,對於記憶體洩漏問題,我們已經完美的解決了。但對於整個 MVP 的實現,貌似還不是那麼完美。

有什麼問題呢?在上面的程式碼中,我們在 V 層實現了 Presenter 的繫結與解綁操作。但是,在實際應用開發

過程中,會有很多個涉及網路請求操作的 Activity,難不成每個 Activity 都要去實現重寫繫結與解綁?

很明顯,這樣做是可以的!哈哈哈!但是出於對自己的嚴格要求以及對程式碼質量的不斷追求,

顯然,優化工作是一定要做的!那麼,下面,我們的任務就是如何優化、如何掃除多餘臃腫程式碼?

1. 建立一個抽象基類,BaseMVPActivity

提供 createPresenter(),並返回 Presenter 物件,這樣拿到了子類的 Presenter

物件,就可以進行繫結解綁操作了。

public abstract class BaseMVPActivity<T extends IPresenter> extends AppCompatActivity implements IView {

    protected T mPresenter;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(createView());

        mPresenter = createPresenter();
        if (null == mPresenter) {
            throw new IllegalStateException("Please call mPresenter in BaseMVPActivity(createPresenter) to create!");
        } else {
            mPresenter.attach(this);
        }

        viewCreated();

    }

    protected abstract void viewCreated();

    @Override
    protected void onDestroy() {
        super.onDestroy();
        if (null != mPresenter){
            mPresenter.detach();
        }
    }

    protected abstract int createView();
    protected abstract T createPresenter();

    @Override
    public void showLoading() {

    }

    @Override
    public void hideLoading() {

    }

}
複製程式碼

2. 建立基類: BasePresenter,並實現 IPresenter,重寫繫結解綁方法。

public class BasePresenter<V extends IView> implements IPresenter<V> {

    protected V view;

    @Override
    public void attach(V view) {
        this.view = view;
    }

    @Override
    public void detach() {
        this.view = null;
    }

}
複製程式碼

3. 建立介面:IView,可以是空實現,也可以宣告一些共用的方法。

public interface IView {

    void showLoading();

    void hideLoading();

}
複製程式碼

修改之後的 Activity:

/**
 * View 層,負責 UI 繪製以及與使用者的互動
 */
public class MVPDemoAty extends BaseMVPActivity<DataPresenter> implements DataView {

    private static final String APP_KEY = "dbb6893ab0913b02724696504181fe39";

    private Button btnGet;
    private RecyclerView recyclerView;

    private DataAdapter mAdapter;

    private ProgressDialog mDialog;

    @Override
    protected void viewCreated() {
        mDialog = new ProgressDialog(this);
        mDialog.setMessage("玩命載入中...");

        btnGet = findViewById(R.id.btnGet);
        recyclerView = findViewById(R.id.recyclerView);

        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        // linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        recyclerView.setLayoutManager(linearLayoutManager);


        mAdapter = new DataAdapter(this, new ArrayList<ArticleBean>());
        recyclerView.setAdapter(mAdapter);

        btnGet.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mDialog.show();
                mPresenter.getData(APP_KEY);
            }
        });
    }

    @Override
    protected int createView() {
        return R.layout.activity_mvp_demo;
    }

    @Override
    protected DataPresenter createPresenter() {
        return new DataPresenter();
    }

    @Override
    public void getDataSuccess(List<ArticleBean> articleList) {
        mDialog.dismiss();
        mAdapter.setNewData(articleList);
    }

    @Override
    public void getDataFail(String failMsg) {
        mDialog.dismiss();
        Toast.makeText(this, failMsg, Toast.LENGTH_SHORT).show();
    }

}
複製程式碼

到此,一個較完善的 MVP 架構,已經實現的差不多了。上面實現的是 Activity 的MVP實現,

Fragment 也是一樣,在這裡就不實現了。當然,對於上面實現的 MVP 仍然還有很多可以優化之處,

時間有限,就先實現到這裡,以後有時間再改造。最後,附上 Github 下載地址:

MVPDemo

相關文章