Tangram动态页面进化探索之路：数据分离篇

2024-01-26 15:26:58

前言

经过前五篇系列文章，我们对Tangram和vlayout也有了初步认识，这篇文章开始将结合业务场景使用，探索框架能力能对业务带来的支持。因为调研本身是一个需要不断踩坑的过程，所以大纲也做了微调，后续会根据实际使用过程发现的问题和解决方案进行更新。本文将对Tangram的json模型进行解析，并探讨如何进行数据分离，使数据更易维护和扩展。

Tangram的数据结构

Tangram的数据结构主要由ViewItem和Layout组成，ViewItem表示单个视图，Layout表示视图的布局方式。一个Tangram页面由一个或多个Layout组成，每个Layout包含一个或多个ViewItem。

数据分离

在实际项目中，数据的来源往往是多种多样的，可能来自网络请求、本地数据库或其他第三方服务。为了使数据更易维护和扩展，我们可以将数据与Tangram的ViewItem和Layout进行分离。

数据分离有以下几个好处：

提高代码的可维护性：将数据与Tangram的ViewItem和Layout分离，可以使代码更易阅读和维护。
提高代码的可复用性：将数据与Tangram的ViewItem和Layout分离，可以使数据更易在不同的Tangram页面中复用。
提高代码的扩展性：将数据与Tangram的ViewItem和Layout分离，可以使代码更易扩展，当数据发生变化时，只需要修改数据即可，而不需要修改Tangram的ViewItem和Layout。

实现数据分离

数据分离可以通过多种方式实现，一种简单的方法是使用MVP模式。MVP模式将数据、视图和控制逻辑分离成三个独立的模块，数据模块负责数据获取和处理，视图模块负责界面的展示，控制模块负责协调数据模块和视图模块之间的交互。

在MVP模式中，数据模块可以是一个独立的类，负责从各种数据源获取数据并进行处理。视图模块可以是一个Activity或Fragment，负责界面的展示。控制模块可以是一个Presenter类，负责协调数据模块和视图模块之间的交互。

总结

数据分离是Tangram框架中一个非常重要的概念，通过数据分离，我们可以使代码更易维护、更易复用和更易扩展。在实际项目中，我们可以通过使用MVP模式来实现数据分离。

示例代码

public class TangramAdapter extends TangramBaseAdapter {

    private List<TangramItem> mTangramItems;

    public TangramAdapter(List<TangramItem> tangramItems) {
        mTangramItems = tangramItems;
    }

    @Override
    public int getItemCount() {
        return mTangramItems.size();
    }

    @Override
    public TangramItem getItem(int position) {
        return mTangramItems.get(position);
    }
}

public class TangramItem {

    private ViewItem mViewItem;
    private Layout mLayout;

    public TangramItem(ViewItem viewItem, Layout layout) {
        mViewItem = viewItem;
        mLayout = layout;
    }

    public ViewItem getViewItem() {
        return mViewItem;
    }

    public Layout getLayout() {
        return mLayout;
    }
}

public class TangramPresenter implements ITangramPresenter {

    private ITangramView mTangramView;
    private ITangramModel mTangramModel;

    public TangramPresenter(ITangramView tangramView, ITangramModel tangramModel) {
        mTangramView = tangramView;
        mTangramModel = tangramModel;
    }

    @Override
    public void loadData() {
        mTangramModel.loadData(new ITangramModel.OnDataLoadListener() {
            @Override
            public void onSuccess(List<TangramItem> tangramItems) {
                mTangramView.setData(tangramItems);
            }

            @Override
            public void onFail(String msg) {
                mTangramView.showError(msg);
            }
        });
    }
}

public interface ITangramView {

    void setData(List<TangramItem> tangramItems);

    void showError(String msg);
}

public interface ITangramModel {

    void loadData(OnDataLoadListener listener);

    interface OnDataLoadListener {

        void onSuccess(List<TangramItem> tangramItems);

        void onFail(String msg);
    }
}