ProgressFragment的简单封装

写在前面

一般我们开发应用的时候，比如首页或者详情界面，当请求数据的时候，我们一般都会给用户一个简单的提示，比如加一个进度条或者弹出一个Dialog。但是有时候弹出Dialog的时候只是给用户了一个提示，但是当出现错误之后，也只是简单的一个Toast提示，并不能再次进行请求(有可能稍微做些处理，比如请求错误之后隐藏content布局然后在显示一个错误布局)，第一种情况体验很是糟糕，第二种情况稍微好点，但是我们每次写一个布局都需要多写错误布局(或者写一个公共的，然后在其他地方进行引用，但是有一点就是我们在每次的activity或者fragment使用的时候都需要写入逻辑)，造成不必要的代码冗余。今天就来进行封装一下，完成一个侵入式的ProgressFragment。

开始实现

第一步分析

我们首先要实现的封装，能够达到以下的几个要求
* 1、加载的时候显示Loading状态
* 2、数据为空或者错误的时候显示数据为错误或者其他提示
* 3、正常情况显示正常数据状态
* 4、当“数据为空或者错误状态”的时候，可以点击进行重新请求数据

原理分析

看到那四个需要实现的条件，我们大致可以了解到，需要有三种布局状态正常布局状态、错误布局状态、Loading状态有了这几种状态，我们就可以在请求的时候根据我们定义的以下方法(或者类似方法),然后控制不同布局的显示和加载

• showLoading()方法中显示Loading状态布局
• showError()或者showNoData()方法显示错误状态布局
• 其余正常状态显示正常布局状态(也就是刚开始这个布局是显示visiable)

代码实现

有了分析，我们首先可以知道需要三种布局(错误、加载、正常)

错误布局

 <LinearLayout
        android:id="@+id/view_empty"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:visibility="gone">

        <TextView
            android:id="@+id/text_tip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/empty_data"/>
    </LinearLayout>

加载布局

  <LinearLayout
        android:id="@+id/view_progress"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:gravity="center"
        android:orientation="vertical"
        android:visibility="gone">


        <ProgressBar
            android:id="@+id/progress"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

        <TextView
            android:id="@+id/text_loading"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:text="@string/loading"/>

    </LinearLayout>

正常布局

 <FrameLayout
        android:id="@+id/view_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </FrameLayout>

布局完成之后，首先说明一下，他们三个的顶层布局是FrameLayout(ViewGroup的子类)
然后看下逻辑代码怎么实现的吧。

第一步就是找到布局id

 @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //跟布局
        mRootView = (FrameLayout) inflater.inflate(R.layout.fragment_progress, container, false);
        //空布局也就是错误布局
        mViewEmpty = mRootView.findViewById(R.id.view_empty);
        //对错误布局实现点击事件  完成加载出错或者数据为空的时候  点击重新请求数据逻辑
        mViewEmpty.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                onEmptyViewClick();
            }
        });
        //加载loading布局
        mViewProgress = mRootView.findViewById(R.id.view_progress);
        //真实的布局
        mViewContent = (FrameLayout) mRootView.findViewById(R.id.view_content);
        //加载出错或者数据为空显示的错误布局的一个提示
        mEmptyTextView = (TextView) mRootView.findViewById(R.id.text_tip);
        return mRootView;
    }

第二步确定什么时候加载真实布局

  @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        this.mApplication = (CNMarketApplication) getActivity().getApplication();
        setupAcitivtyComponent(mApplication.getAppComponent());
        //加载真实的布局
        setRealContentView();
        //用于初始化布局控件  这里也可以不写  因为我们使用了ButterKnife实现对控件的注解
        init();
        //用于子类实现  请求数据方法
        initData();
    }

setRealContentView()方法

 /**
     * 设置真正的布局
     */
    private void setRealContentView() {
        View realContentView = LayoutInflater.from(getActivity()).inflate(setLayout(), mViewContent, true);
        mUnbinder = ButterKnife.bind(this, realContentView);
    }

第三步控制三种布局的显示

我们这个时候要写控制三种布局的显示和隐藏的逻辑，这个时候可能有人会这样写

    /**
     * 显示加载loading布局
     */
    public void showProgressView(){
        mViewProgress.setVisibility(View.VISIBLE);
        mViewEmpty.setVisibility(View.GONE);
        mViewContent.setVisibility(View.GONE);
    }

然后在写剩余的两种逻辑，这样写没有错，但是感觉代码是有点冗余而且也不太好看，前面我们提到过，跟布局是一个FrameLayout，属于ViewGroup的子类，那么他就有getChildCount()方法获取子view那么我们就可以这样写逻辑了。

  /**
     * 判断要显示的子view  正常布局  错误布局  loading布局  根据传入的viewId
     *
     * @param viewId 需要显示的viewid
     */
    public void showView(int viewId) {
        int childCount = mRootView.getChildCount();
        for (int i = 0; i < childCount; i++) {
            if (mRootView.getChildAt(i).getId() == viewId) {
                mRootView.getChildAt(i).setVisibility(View.VISIBLE);
            } else {
                mRootView.getChildAt(i).setVisibility(View.GONE);  //隐藏
            }
        }
    }

然后接下来这样写三个逻辑

    /**
     * 显示进度条view
     */
    public void showProgressView() {
        showView(R.id.view_progress);
    }

    /**
     * 显示真实布局view
     */
    public void showContentView() {
        showView(R.id.view_content);
    }

    /**
     * 显示数据为空view
     */
    public void showEmptyView() {
        showView(R.id.view_empty);
    }

    /**
     * 显示数据为空view
     */
    public void showEmptyView(int resId) {

        showView(R.id.view_empty);
        mEmptyTextView.setVisibility(View.VISIBLE);
        mEmptyTextView.setText(resId);
    }

    /**
     * 显示数据为空view
     */
    public void showEmptyView(String msgId) {
        showView(R.id.view_empty);
        mEmptyTextView.setVisibility(View.VISIBLE);
        mEmptyTextView.setText(msgId);
    }

第四步子类使用

这个时候基本逻辑就差不多完事了，然后剩余的就需要子Fragment或者子activity进行继承和重写方法，实现逻辑了。比如

重新请求数据

    @Override
    public void onEmptyViewClick() {
        super.onEmptyViewClick();
        //重新请求数据
        mPresenter.requestDatas();
    }

显示错误和数据为空逻辑

@Override
    public void showNoData() {
        //showError("没有数据进行展示");
        showEmptyView("没有数据进行展示");
        Toast.makeText(getActivity(), "没有数据进行展示", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void showError(String msg) {
       // showError(msg);
        showEmptyView(msg);
        Toast.makeText(getActivity(), "服务器开小差了" + msg, Toast.LENGTH_SHORT).show();
    }

这里整体逻辑就算实现了，完整的代码我就不贴了，这里直接给出git地址

• ProgressFragment的简单封装实现错误/空数据/loading/正常界面切换。

• 子类的简单使用实例

• 一个集RxJava+Retrofit+MVP+Dagger2的app