美文网首页AndroidMVP项目Android开发
最清晰的MVP架构实现了最流畅的直播页面交互滑动

最清晰的MVP架构实现了最流畅的直播页面交互滑动

作者: 菜鸟窝 | 来源:发表于2017-08-25 11:52 被阅读314次
    本文为菜鸟窝作者蒋志碧的连载。“从 0 开始开发一款直播 APP ”系列来聊聊时下最火的直播 APP,如何完整的实现一个类"腾讯直播"的商业化项目
    视频地址:http://www.cniao5.com/course/10121

    【从 0 开始开发一款直播 APP】5.1 MVP 完全解析 -- 实现直播登录
    【从 0 开始开发一款直播 APP】5.2 MVP 之 Fragment 交互实现滑动导航
    【从 0 开始开发一款直播 APP】5.3 MVC 完全解析 -- 实现直播登录
    【从 0 开始开发一款直播 APP】5.4 MVC 之 Fragment 交互实现滑动导航


    上一章讲了 MVP 实现登录功能,这一章讲 MVP 实现主页面展示,前面已经实现了这个功能,现在结合 MVP 来讲解。

    MVP 之 Fragment 交互实现滑动导航

    Presenter

    一、MainPresenter 对应于 MainActivity

    1、定义 BasePresenter 接口,主要方法是 start() — presenter 开始处理数据,绑定 Presenter 。 finish() — 处理销毁工作,界面结束时调用,取消绑定 Presenter 的方法。

    2、定义 IMainPresenter 抽象类实现 BasePresenter 接口,定义登录所需逻辑处理方法,与 IMainView 关联。

    3、定义 MainPresenter 继承 IMainPresenter 抽象类,实现抽象方法以及处理逻辑。

    二、LiveMainPresenter 对应于 LiveMainFragment

    LiveMainPresenter 与 LiveMainFragment 关联

    View

    一、MainActivity

    1、定义 BaseView 接口,将通用方法封装到里面。

    2、定义 IMainView 接口,继承BaseView

    3、MainActivity 实现 IMainView 及其抽象方法

    二、LiveMainFragment

    LiveMainFragment 与 MainActivity 关联,LiveMainFragment 主要在 MainActivity 中显示 FragmentTabHost 数据。

    Model

    看到上面运行效果图中,数据就是图片以及标题,还有 Fragment 等,直接在 Presenter 定义。

    看完类图,下面开始创建 MVP 基本架构,下面是根据上面类图创建的相关包以及接口和类,红色矩形框中的是LiveMainFragment 以及 MainActivity 展示数据要用到的类,下面一一进行讲解。

    注意:本章讲解是基于前面的一篇文章进行讲解,不做过多的介绍。
    具体细节查看:【从 0 开始开发一款直播 APP】2.2 高层封装之 Fragment -- 滑动导航

    MainActivity 的数据展示

    Presenter 所有类实现

    1、MainPresenter

    public abstract class IMainPresenter implements BasePresenter{
    
        protected BaseView mBaseView;
        protected BaseActivity mContext;
    
        public IMainPresenter(BaseView baseView,BaseActivity context) {
            this.mBaseView = baseView;
            this.mContext = context;
        }
    
        //初始化 FragmentTabHost
        protected abstract void initFragment();
        //展示 Tab 选项卡
        protected abstract View getTabItemView(int i);
    }
    

    2、IMainPresenter

    BasePresenter 和登录中的功能一样,请查看前面一节内容,MainPresenter 与 Model 关联,这里的 Model 是 FragmentTabHost 实现的底部导航。

    public class MainPresenter extends IMainPresenter {
    
        private IMainView mIMainView;
        private FragmentTabHost mTabHost;
        private final Class mFragmentArray[] = {LiveMainFragment.class, PublishFragment.class, UserInfoFragment.class};
        private int mImageViewArray[] = {R.drawable.tab_live_selector, R.drawable.tab_pubish_selector, R.drawable.tab_my_selector};
        private String mTextViewArray[] = {"live", "publish", "mine"};
    
        public MainPresenter(IMainView mainView, BaseActivity context) {
            super(mainView,context);
            mIMainView = mainView;
        }
    
        @Override
        public void start() {
        }
    
        @Override
        public void finish() {
            if (mIMainView!=null){
                mIMainView = null;
            }
        }
    
    
        @Override
        public void initFragment() {
            mTabHost = mContext.obtainView(android.R.id.tabhost);
            mTabHost.setup(mContext, mContext.getSupportFragmentManager(), R.id.contentPanel);
            int fragmentCount = mFragmentArray.length;
            for (int i = 0; i < fragmentCount; i++) {
                TabHost.TabSpec tabSpec = mTabHost.newTabSpec(mTextViewArray[i]).setIndicator(getTabItemView(i));
                mTabHost.addTab(tabSpec, mFragmentArray[i], null);
                mTabHost.getTabWidget().setDividerDrawable(null);
            }
        }
    
        @Override
        protected View getTabItemView(int i) {
            View view;
            view = LayoutInflater.from(mContext).inflate(R.layout.tab_live, null);
            ImageView imageView = (ImageView) view.findViewById(R.id.tab_icon);
            imageView.setImageResource(mImageViewArray[i]);
            return view;
        }
    
        @Override
        protected void checkCacheAndLogin() {
        }
    }
    

    View 的所有类实现

    1、IMainView

    目前还没有其它新增方法,后续慢慢添加

    public interface IMainView extends BaseView {
    }
    

    2、MainActivity

    MainActivity 与 MainPresenter 关联,与原来的代码相比,避免了与 Model 直接交互。

    public class MainActivity extends BaseActivity implements IMainView {
        private MainPresenter mMainPresenter;
    
        @Override
        protected void setActionBar() {
        }
    
        @Override
        protected void setListener() {
        }
    
        @Override
        protected void initData() {
        }
    
        @Override
        protected void initView() {
            mMainPresenter = new MainPresenter(this,this);
            mMainPresenter.initFragment();
        }
    
        @Override
        protected int getLayoutId() {
            return R.layout.activity_main;
        }
    
        @Override
        public void showLoading() {
        }
    
        @Override
        public void dismissLoading() {
        }
    
        @Override
        public void showMsg(String msg) {
        }
    
        @Override
        public void showMsg(int msgId) {
        }
    
        @Override
        public Context getContext() {
            return this;
        }
    
    }
    

    运行效果大概是这样。

    上面的导航依然是基于 LiveMainFragment

    LiveMainFragment 的数据展示

    LiveMainPresenter

    LiveMainPresenter 对应的 View 是 LiveMainFragment,LiveMainPresenter 与 Model 关联,避免 Model 直接与 View 交互

    public class LiveMainPresenter {
        private BaseActivity mContext;
        //数据展示
        private ViewPager mViewPager;
        private PagerSlidingTabStrip mTabStrip;
        private ArrayList<String> mTitles;
        private ArrayList<Fragment> mFragments;
    
        public LiveMainPresenter(BaseActivity context) {
            this.mContext = context;
        }
    
        public FragmentStatePagerAdapter getAdapter() {
            return new PagerAdapter(mContext.getSupportFragmentManager(),mTitles,mFragments);
        }
    
        public void initViewPager(View rootView){
            mViewPager = (ViewPager) rootView.findViewById(R.id.viewpager);
            mTabStrip = (PagerSlidingTabStrip) rootView.findViewById(R.id.pager_sliding_tab_strip);
            mTabStrip.setTextColorResource(R.color.white);
            mTabStrip.setIndicatorColorResource(R.color.white);
            mTabStrip.setDividerColor(Color.TRANSPARENT);
            mTabStrip.setTextSize(rootView.getResources().getDimensionPixelSize(R.dimen.h6));
            mTabStrip.setUnderlineHeight(1);
            mViewPager.setCurrentItem(0);
        }
    
        public void initViewPagerData(){
            mTitles = new ArrayList<>();
            mFragments = new ArrayList<>();
            mTitles.add("最新");
            mTitles.add("最热");
            mTitles.add("达人");
            mTitles.add("活力");
            mTitles.add("英雄联盟");
            mTitles.add("王者荣耀");
            for (String s:mTitles){
                Bundle bundle = new Bundle();
                bundle.putString("title",s);
                mFragments.add(LiveListFragment.newInstance(bundle));
            }
        }
    
        public void initAdapter(FragmentStatePagerAdapter adapter){
            mViewPager.setAdapter(adapter);
            mTabStrip.setViewPager(mViewPager);
        }
    }
    

    View — LiveMainFragment

    LiveMainFragment 与 LiveMainPresenter 关联,调用其方法更新数据展示在界面上

    public class LiveMainFragment extends BaseFragment implements View.OnClickListener {
    
        private LiveMainPresenter mLiveMainPresenter;
    
        @Override
        protected void initData() {
        }
    
        @Override
        protected void setListener() {
            obtainView(R.id.iv_search).setOnClickListener(this);
            obtainView(R.id.iv_message).setOnClickListener(this);
        }
    
        @Override
        protected void initView(View rootView) {
            mLiveMainPresenter = new LiveMainPresenter(mContext);
            mLiveMainPresenter.initViewPager(rootView);
            mLiveMainPresenter.initViewPagerData();
        }
    
        @Override
        protected int getLayoutId() {
            return R.layout.fragment_live_main;
        }
    
        @Override
        public void onClick(View v) {
        }
    }
    

    运行效果



    使用 MVP 架构对于大型项目的开发结构清晰,只要搞懂三者的关系,画出大致类图,就可以很轻松写出代码了。


    (菜鸟窝,程序员的黄埔军校,转载请注明出处)

    添加菜鸟窝运营微信:yrioyou,备注【菜鸟直播】,入群交流

    微信图片_20170803172638.jpg

    关注菜鸟窝官网,免费领取140套开源项目

    菜鸟窝官网公号二维码.png

    相关文章

      网友评论

      • 等风来_Android:厉害了,过段关注,紧跟大佬步伐
        菜鸟窝:@等风来_3860 ,谢谢!可以关注菜鸟窝官网公号,领取更多福利哦

      本文标题:最清晰的MVP架构实现了最流畅的直播页面交互滑动

      本文链接:https://www.haomeiwen.com/subject/dnxflxtx.html