美文网首页Android架构android 项目开发Android探索之路
MVP架构实现的Github客户端(3-功能实现)

MVP架构实现的Github客户端(3-功能实现)

作者: anly_jun | 来源:发表于2016-07-22 08:21 被阅读3646次

    系列文章:
    1-准备工作
    2-搭建项目框架
    3-功能实现
    4-加入网络缓存

    前文搭建了项目的大体架构, 本文以实现github中最常用的搜索repository功能为例, 讲述下功能开发的整个过程以及关于MVP, Dagger2注入, Rx以及Retrofit, OkHttp等在准备工作中提到的一系列开源库的使用.

    1, 功能梳理

    基本功能类似于Github中的Search功能一致, 包含Repository/User/Issue/Code的搜索, 并可选排序方式(Best match, Most stars等等).

    本文以搜索Repository为例, 默认按照Most Stars来排序列举搜索结果. 监听用户输入关键字, 当超过600ms没有输入时自动开始搜索, 按照stars数显示搜索结果.

    目前只是以此功能来演示前文的MVP框架, 并不完善~
    源码将持续更新, 完善功能. 欢迎star.

    效果如下:


    功能演示

    2, 从数据开始(M)

    Github相关API

    https://api.github.com/search/repositories?q=tetris+language:assembly&sort=stars&order=desc
    

    根据API, 我们可以写Retrofit的接口以及相关Model类:

    public interface RepoService {
    
        @GET("search/repositories")
        Observable<SearchResultResp> searchRepo(@Query("q") String key, @Query("sort") String sort,
                                                @Query("order") String order, @Query("page") int page,
                                                @Query("per_page") int pageSize);
    }
    

    其中Repo这个Model类就不贴了, 太长.
    建议大家可以使用Android Studio的插件GsonFormat来生成:


    GsonFormat

    Retrofit/OkHttpClient设计

    大家都知道Retrofit一般会是单例, 会设置一个baseUrl.
    考虑到Github客户端这个应用, 我会加入Trending这个功能, 但是官方并没有提供相关接口. 这个baseUrl就可以不同接口不一样.
    另外使用的OkHttpClient也可能针对不同接口使用不同的interceptor.
    在此做了一个小框架, 以便扩展(时刻牢记开闭原则).

    data_architecture
    • ApiEndpoint 接口提供baseUrl.
    • BaseOkHttpClient 提供OkHttpClient实例.
    • BaseRetrofit 依赖ApiEndpoint和BaseOkHttpClient, 提供Retrofit实例.
    • GithubRepoRetrofit 是基于github的url的Retrofit实现.

    数据层整体结构

    综上, 数据层的整体结构如下:

    M_architecture
    • RepoApi 定义业务接口.
    • RepoDataSource 实现RepoApi接口, 通过RepoService这个Retrofit格式的Restful接口取数据并可以在此做相应处理.

    3, 绘制界面(V)

    这部分就不细说了, 参看代码. 抽象了几个Base类:

    V_architecture

    4, 数据关联显示(P)

    Presenter作为M和V的桥梁, 如2-搭建项目框架所说, 其拥有V和M的实例:

    P_architecture

    通过BaseMvpPresenter中的attachView来获取View实例, 在其构造函数中关联RepoApi这个M层接口.

    在此抽象了一个RxMvpPresenter的基类, 主要用来解决Observable的unsubsribe问题.

    5, 将MVP注入起来(Dagger2)

    上面介绍完M, V, P这三个角色, 但是他们是怎么关联起来的呢? 或者说怎么实例化的呢? 有请Dagger2出场.

    具体的Dagger2的使用请自行Google~, 基本作用如下几点. 我后续也会抽时间整理Dagger2的使用经验, 敬请期待.

    下面简单说下我们这个功能中的注入情况:s

    使用@Module和@Providers来对外提供依赖

    搭建项目框架我们提到di的基本框架中, 就写了一个ApplicationModule用来对外提供Application级别的依赖, 在此我们可以将Retrofit Service放在这里:

    @Module
    public class ApplicationModule {
        protected final Application mApplication;
    
        public ApplicationModule(Application application) {
            mApplication = application;
        }
    
        @Provides
        Application provideApplication() {
            return mApplication;
        }
    
        @Provides
        @ApplicationContext
        Context provideContext() {
            return mApplication;
        }
    
        @Provides
        @Singleton
        RepoService provideRepoService(GithubRepoRetrofit retrofit) {
            return retrofit.get().create(RepoService.class);
        }
    }
    

    可以看到我们使用的是GithubRepoRetrofit这个Retrofit示例来创建Service的.
    那么这个GithubRepoRetrofit是怎么实例化的呢? 往下看...

    构造函数上的@Inject

    当用@Inject来注解一个构造函数时, Dagger2会根据其构造参数来生成一个该实例. 这样做是为了避免定义太多的@Provides.
    例如:

    @Inject
    public GithubRepoRetrofit(NormalHttpClient mHttpClient) {
        this.mHttpClient = mHttpClient;
    }
    
    @Inject
    public NormalHttpClient() {
    }
    
    @Inject
    public SearchPresenter(RepoApi api) {
        this.mRepoApi = api;
    }
    

    变量上的@Inject

    上面两个原则用来提供实例, 这个就是用来请求实例的.
    例如在SearchFragment里面我们需要一个SearchPresenter的实例:

    @Inject
    SearchPresenter mPresenter;
    

    如上即可, 我们无需关注这个Presenter怎么实例化的. 这个给了我们很多想象空间, 我们可以随意替换这个Presenter的实现, 都不需要改动View的代码.

    @Component的作用

    以上讲了实例的产生和消费, 那么他们是怎么关联的呢? 这就需要@Component了, Component用来做实例关联和inject.
    所有的@Component类都会在编译时生成一个Dagger开头的类, 里面根据Component定义来提供实例, 和注入关系.

    例如我们的Component:

    @PerActivity
    @Component(
            dependencies = ApplicationComponent.class,
            modules = {ActivityModule.class, RepoModule.class, TrendingRepoModule.class})
    public interface MainComponent extends ActivityComponent {
    
        void inject(MostStarFragment mostStarFragment);
    
        void inject(TrendingFragment trendingFragment);
    
        void inject(SearchFragment searchFragment);
    }
    

    可以看到MainComponent依赖ApplicationComponent, 并从ActivityModule, RepoModule, TrendingRepoModule这三个Module中获取依赖实例.

    另外提供inject关系到MostStarFragment, TrendingFragment, SearchFragment这三个使用者身上, 要使用这个inject关系, 还需在onCreate中inject一下:

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getComponent(MainComponent.class).inject(this);
    
        mPresenter.attachView(this);
    }
    

    具体大家可以查看源码以及编译后生成的DaggerMainComponent.

    6, RxBinding/RxJava的使用

    在这个功能中, 使用RxBinding对EditText的Text Change事件做了事件流处理, 以便可以很方便的做延时, 过滤, 与查询接口合并等. 具体RxBinding的功能不在此细说了.

    功能使用如下:

    public void bindSearchView(EditText searchTextView) {
        mCompositeSubscription.add(RxTextView.textChanges(searchTextView)
                .subscribeOn(AndroidSchedulers.mainThread())
                .filter(new Func1<CharSequence, Boolean>() {
                    @Override
                    public Boolean call(CharSequence charSequence) {
                        return charSequence.length() > 0;
                    }
                })
                .debounce(600, TimeUnit.MILLISECONDS)
                .subscribeOn(Schedulers.io())
                .switchMap(new Func1<CharSequence, Observable<ArrayList<Repo>>>() {
                    @Override
                    public Observable<ArrayList<Repo>> call(CharSequence charSequence) {
                        String key = charSequence.toString();
                        return mRepoApi.searchMostStarredRepo(key, mLanguage)
                                    .onErrorResumeNext(new Func1<Throwable, Observable<? extends ArrayList<Repo>>>() {
                                        @Override
                                        public Observable<? extends ArrayList<Repo>> call(Throwable throwable) {
                                            getMvpView().showError(throwable);
                                            AppLog.d("searchMostStarredRepo onErrorResumeNext:" + throwable);
                                            return Observable.empty();
                                        }
                                    })
                                    .doOnSubscribe(new Action0() {
                                        @Override
                                        public void call() {
                                            mActivity.runOnUiThread(new Runnable() {
                                                @Override
                                                public void run() {
                                                    getMvpView().showLoading();
                                                }
                                            });
                                        }
                                    })
                                    .doOnTerminate(new Action0() {
                                        @Override
                                        public void call() {
                                            mActivity.runOnUiThread(new Runnable() {
                                                @Override
                                                public void run() {
                                                    getMvpView().dismissLoading();
                                                }
                                            });
                                        }
                                    });
                    }
                })
                .observeOn(AndroidSchedulers.mainThread())
                .onErrorResumeNext(new Func1<Throwable, Observable<? extends ArrayList<Repo>>>() {
                    @Override
                    public Observable<? extends ArrayList<Repo>> call(Throwable throwable) {
                        AppLog.d("onErrorResumeNext:" + throwable);
                        getMvpView().showError(throwable);
                        return Observable.empty();
                    }
                })
                .subscribe(new ResponseObserver<ArrayList<Repo>>() {
                    @Override
                    public void onSuccess(ArrayList<Repo> repos) {
                        getMvpView().showContent(repos);
                    }
    
                    @Override
                    public void onError(Throwable e) {
                        AppLog.d("onError:" + e);
                        getMvpView().showError(e);
                    }
                }));
    
    }
    

    看起来好长, 实际就几步:
    1, 字符串长度过滤.
    2, debounce操作, 即仅在过了一段指定的时间还没发射数据时才发射一个数据
    3, 与查询接口做switchMap操作.

    7, 结语

    至此, 一个基于Dagger2, RxJava, Retrofit, OkHttp等library的MVP架构的实现已经完成. 这几篇文章只是提供给大家一个架构的方向, 欢迎大家fork.

    另外GithubApp这个工程还会持续更新, 包括功能上和架构, 以及一些新的主流库的使用也会在这个工程上体现, 欢迎关注star.

    GithubApp源码

    相关文章

      网友评论

      • 7755920742a0:你好,给你“打赏”了8.88元,钱不多,是个意思。看了你的文章十分有收获,希望能交个朋友
        anly_jun: @程序猿攻城狮 谢谢😜,互相学习共同进步~
      • 字字珠玑:作者你好,我导入了Github工程,编译也成功了,但是手机上打开之后是个空白页面,点击页面左上角的按钮也没有响应,这是为什么呢
        anly_jun:@字字珠玑 Sorry, 目前还在开发, 时间有限, 有些逻辑还没有处理, 左边屏幕向右滑动, 会有NavigationDrawer滑出, 菜单在那里~

      本文标题:MVP架构实现的Github客户端(3-功能实现)

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