本文为菜鸟窝作者蒋志碧的连载。“从 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 来讲解。
![](https://img.haomeiwen.com/i5205232/cfb59c56e119c7a6.gif)
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 定义。
![](https://img.haomeiwen.com/i5205232/10836810c33c9869.png)
看完类图,下面开始创建 MVP 基本架构,下面是根据上面类图创建的相关包以及接口和类,红色矩形框中的是LiveMainFragment 以及 MainActivity 展示数据要用到的类,下面一一进行讲解。
注意:本章讲解是基于前面的一篇文章进行讲解,不做过多的介绍。
具体细节查看:【从 0 开始开发一款直播 APP】2.2 高层封装之 Fragment -- 滑动导航
![](https://img.haomeiwen.com/i5205232/5dbd30aa9b18ed9d.jpeg)
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;
}
}
运行效果大概是这样。
![](https://img.haomeiwen.com/i5205232/0b7f18881be1a1e6.gif)
上面的导航依然是基于 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) {
}
}
运行效果
![](https://img.haomeiwen.com/i5205232/18e514d863f69e9e.gif)
使用 MVP 架构对于大型项目的开发结构清晰,只要搞懂三者的关系,画出大致类图,就可以很轻松写出代码了。
(菜鸟窝,程序员的黄埔军校,转载请注明出处)
添加菜鸟窝运营微信:yrioyou,备注【菜鸟直播】,入群交流
![](https://img.haomeiwen.com/i5205232/1fc686c14e110906.jpg)
关注菜鸟窝官网,免费领取140套开源项目
![](https://img.haomeiwen.com/i5205232/1913e0addd249e97.png)
网友评论