BaseRecyclerViewAdapterHelper源码解读(八) 空布局

客官°小女子只卖身不卖艺 2022-06-06 02:29 535阅读 0赞

# 空布局 #

> 为了能给用户带来更人性化的体验,空布局这个功能我觉得很有必要加入,当RecyclerView没有数据的时候显示一个空布局给用户,瞬间感觉高大上.

此篇文章为BaseRecyclerViewAdapterHelper源码解读第八篇,[开源库地址][Link 1],如果没有看过之前7篇文章的同学可以先去看看,大神可直接跳过.

[BaseRecyclerViewAdapterHelper源码解读(一) 封装简单的adapter和万能的BaseViewHolder][BaseRecyclerViewAdapterHelper_ _adapter_BaseViewHolder]

[BaseRecyclerViewAdapterHelper源码解读(二) 添加header和footer][BaseRecyclerViewAdapterHelper_ _header_footer]

[BaseRecyclerViewAdapterHelper源码解读(三) 添加动画][BaseRecyclerViewAdapterHelper_]

[BaseRecyclerViewAdapterHelper源码解读(四) 上拉加载更多][BaseRecyclerViewAdapterHelper_ 1]

[BaseRecyclerViewAdapterHelper源码解读(五) header和footer完善][BaseRecyclerViewAdapterHelper_ header_footer]

[BaseRecyclerViewAdapterHelper源码解读(六) 分组布局][BaseRecyclerViewAdapterHelper_ 2]

[BaseRecyclerViewAdapterHelper源码解读(七) 多布局][BaseRecyclerViewAdapterHelper_ 3]

## 使用方法 ##

有下面3种方式可供选择,比ListView.setEmptyView()还好用

mQuickAdapter.setEmptyView(layoutResId,viewGroup);

// 没有数据的时候默认显示该布局  
mQuickAdapter.setEmptyView(getView());

// 使用这个之前,记得调用bindToRecyclerView(RecyclerView)  
mQuickAdapter.setEmptyView(layoutResId);

## 添加空布局 ##

//empty
        private FrameLayout mEmptyLayout;
        private boolean mIsUseEmpty = true;
        private boolean mHeadAndEmptyEnable; //头布局和空布局共存
        private boolean mFootAndEmptyEnable;
    
        public void setEmptyView(@LayoutRes int layoutResId, @NonNull ViewGroup viewGroup) {
            View view = LayoutInflater.from(viewGroup.getContext()).inflate(layoutResId, viewGroup,
                    false);
            setEmptyView(view);
        }
    
        /** * bind recyclerView {@link #bindToRecyclerView(RecyclerView)} before use! * * @see #bindToRecyclerView(RecyclerView) */
        public void setEmptyView(@LayoutRes int layoutResId) {
            checkNotNull();
            setEmptyView(layoutResId, getRecyclerView());
        }
    
        public void setEmptyView(@NonNull View emptyView) {
            boolean insert = false;
            if (mEmptyLayout == null) {
                mEmptyLayout = new FrameLayout(emptyView.getContext());
    
                // 默认空布局是match_parent
                final LayoutParams layoutParams = new LayoutParams(LayoutParams.MATCH_PARENT,
                        LayoutParams.MATCH_PARENT);
                final ViewGroup.LayoutParams lp = emptyView.getLayoutParams();
                if (lp != null) {
                    layoutParams.width = lp.width;
                    layoutParams.height = lp.height;
                }
                mEmptyLayout.setLayoutParams(layoutParams);
                insert = true;
            }
    
            //将需要显示的View添加到mEmptyLayout(FrameLayout)中
            mEmptyLayout.removeAllViews();
            mEmptyLayout.addView(emptyView);
            mIsUseEmpty = true;
            if (insert) { // 如果是第一次初始化空布局,那么需要通知adapter刷新
                if (getEmptyViewCount() == 1) {
                    int position = 0;
    
                    //判断有无header,如果有的话,那么header无需刷新 只需要刷新空布局即可
                    if (mHeadAndEmptyEnable && getHeaderLayoutCount() != 0) {
                        position++;
                    }
                    notifyItemInserted(position);
                }
            }
        }
    
        /** * 判断RecyclerView是否为空 */
        private void checkNotNull() {
            if (getRecyclerView() == null) {
                throw new RuntimeException("please bind recyclerView first!");
            }
        }

大体思路:**其实空布局感觉不是那么难,其实就是一个FrameLayout(可以把这个看成是RecyclerView的一个item,其实就是),当外部调用者想使用空布局时传入emptyView,我们直接将该emptyView添加到FrameLayout中,不就搞定了么?**

了解了大致思路,对于上面的代码就比较轻松啦,其实就一个方法比较重要:setEmptyView(@NonNull View emptyView);可以看到,如果是第一次初始化空布局,那么设置一下它的宽高,接下来我们把之前添加到FrameLayout中的View全部移除然后再添加空布局,  
当然,如果是第一次初始化空布局那么需要通知adapter刷新,并且在刷新的时候需要判断当前是否有header,然后才知道空布局的所在RecyclerView中的索引.

## getItemCount() ##

@Override
        public int getItemCount() {
            int count;
            //如果界面上显示了空布局
            if (getEmptyViewCount() == 1) {
                count = 1;
                //如果header可见 则只需要+1就行了,因为header的布局是LinearLayout
                if (mHeadAndEmptyEnable && getHeaderLayoutCount() != 0) {
                    count++;
                }
                if (mFootAndEmptyEnable && getFooterLayoutCount() != 0) {
                    count++;
                }
            } else {  //未显示空布局
                // 1 or 0 数据项 1 or 0 加载更多 1 or 0
                count = getHeaderLayoutCount() + mData.size() + getFooterLayoutCount() +
                        getLoadMoreViewCount();
            }
            return count;
        }

由于我们设置了EmptyView,那么itemCount也随之变化,并且我们需要加入空布局的一些逻辑在里面.  
\- 如果是显示了空布局,那么count+1;再判断是否需要显示headerView,如果需要显示并且有headerView,那么count+1;再判断是否需要显示footerView,如果需要显示并且有footerView那么count+1;  
\- 剩下的就是没有空布局时候的逻辑:`headerView+数据项个数+footerView+loadMoreView`

## getItemViewType() ##

@Override
        public int getItemViewType(int position) {
            if (getEmptyViewCount() == 1) {
                boolean header = mHeadAndEmptyEnable && getHeaderLayoutCount() != 0;
                switch (position) {
                    case 0:
                        if (header) {
                            return HEADER_VIEW;
                        } else {
                            return EMPTY_VIEW;
                        }
                    case 1:
                        if (header) {
                            return EMPTY_VIEW;
                        } else {
                            return FOOTER_VIEW;
                        }
                    case 2:
                        return FOOTER_VIEW;
                    default:
                        return EMPTY_VIEW;
                }
            }
            //1 or 0
            int numHeaders = getHeaderLayoutCount();
            if (position < numHeaders) {
                return HEADER_VIEW;
            } else {
                int adjPosition = position - numHeaders;
                int adapterCount = mData.size();
    
                //中间的数据项
                if (adjPosition < adapterCount) {
                    return getDefItemViewType(adjPosition);
                } else {
                    //剩下 footer 加载中布局
                    adjPosition = adjPosition - adapterCount;
                    int numFooters = getFooterLayoutCount();
                    if (adjPosition < numFooters) {
                        return FOOTER_VIEW;
                    } else {
                        return LOADING_VIEW;
                    }
                }
            }
        }

由于我们设置了EmptyView,那么itemType需要加入空布局的一些逻辑在里面.  
\- 首先我们判断是否设置了EmptyView,再根据position判断当前的type.当设置了EmptyView的时候,这个时候就只有3种布局(EmptyView,headerView,footerView)需要判断.  
\- position==0: 如果有header,那么就是headerView;如果没有header,那么就是EmptyView  
\- position==1: 如果有header,那么就是EmptyView;如果没有header,那么就是footerView  
\- position==2: 肯定就是footerView了  
\- 如果没有设置EmptyView,那么就是剩下的逻辑,之前的博客已经分析过了,这里就不再赘述了.

## onCreateViewHolder() ##

@Override
        public K onCreateViewHolder(ViewGroup parent, int viewType) {
            K baseViewHolder = null;
            this.mContext = parent.getContext();
            this.mLayoutInflater = LayoutInflater.from(mContext);
            switch (viewType) {
                case LOADING_VIEW:
                    baseViewHolder = getLoadingView(parent);
                    break;
                case HEADER_VIEW:
                    baseViewHolder = createBaseViewHolder(mHeaderLayout);
                    break;
                case EMPTY_VIEW:
                    baseViewHolder = createBaseViewHolder(mEmptyLayout);
                    break;
                case FOOTER_VIEW:
                    baseViewHolder = createBaseViewHolder(mFooterLayout);
                    break;
                default:
                    baseViewHolder = onCreateDefViewHolder(parent, viewType);
                    bindViewClickListener(baseViewHolder);
            }
            baseViewHolder.setAdapter(this);
            return baseViewHolder;
    
        }

因为添加了EmptyView所以在onCreateViewHolder()里面需要新添加一个viewType判断,然后通过mEmptyLayout去生成BaseViewHolder

## onBindViewHolder() ##

/** * To bind different types of holder and solve different the bind events * * @param holder * @param position * @see #getDefItemViewType(int) */
        @Override
        public void onBindViewHolder(K holder, int position) {
            //Add up fetch logic, almost like load more, but simpler.
            //这里是判断是否需要下拉加载更多
            autoUpFetch(position);
            //Do not move position, need to change before LoadMoreView binding
            //判断是否需要进行上拉加载更多
            autoLoadMore(position);
            int viewType = holder.getItemViewType();
    
            switch (viewType) {
                case 0:
                    convert(holder, getItem(position - getHeaderLayoutCount()));
                    break;
                case LOADING_VIEW:
                    mLoadMoreView.convert(holder);
                    break;
                case HEADER_VIEW:
                    break;
                case EMPTY_VIEW:
                    break;
                case FOOTER_VIEW:
                    break;
                default:
                    convert(holder, getItem(position - getHeaderLayoutCount()));
                    break;
            }
        }

由于onBindViewHolder()里面需要绑定数据,而headerView、EmptyView、footerView 在adapter里面不管它,绑定数据交给外部调用者去做吧.

## 设置空布局与header和footer共存 ##

/** * 设置当数据为空时是否显示headerView * 调用此方法前需要调用{@link RecyclerView#setAdapter(RecyclerView.Adapter)} * * @param isHeadAndEmpty false:当数据为空时不显示headerView,只显示EmptyView true: * 当数据为空时显示emptyView和headerView */
        public void setHeaderAndEmpty(boolean isHeadAndEmpty) {
            setHeaderFooterEmpty(isHeadAndEmpty, false);
        }
    
        /** * 设置数据为空时是否显示headerView和footerView * 调用此方法前需要调用 {@link RecyclerView#setAdapter(RecyclerView.Adapter)} * * @param isHeadAndEmpty true:显示headerView false:不显示headerView * @param isFootAndEmpty true:显示footerVIew false:不显示footerVIew */
        public void setHeaderFooterEmpty(boolean isHeadAndEmpty, boolean isFootAndEmpty) {
            mHeadAndEmptyEnable = isHeadAndEmpty;
            mFootAndEmptyEnable = isFootAndEmpty;
        }
    
        /** * Set whether to use empty view * 设置是否需要使用EmptyView * @param isUseEmpty true:使用 false:不使用 */
        public void isUseEmpty(boolean isUseEmpty) {
            mIsUseEmpty = isUseEmpty;
        }
    
        /** * When the current adapter is empty, the BaseQuickAdapter can display a special view * called the empty view. The empty view is used to provide feedback to the user * that no data is available in this AdapterView. * * @return The view to show if the adapter is empty. */
        public View getEmptyView() {
            return mEmptyLayout;
        }

这些东西都有些细节问题,就是用几个属性来控制是否需要显示header和footer.

/** * 返回HeaderView在RecyclerView中的位置 * * @return 0 or -1 */
        private int getHeaderViewPosition() {
            //Return to header view notify position
            if (getEmptyViewCount() == 1) {
                //有空布局 并且 头布局可见
                if (mHeadAndEmptyEnable) {
                    return 0;
                }
            } else {
                //没有空布局 返回0
                return 0;
            }
            return -1;
        }
    
        private int getFooterViewPosition() {
            //Return to footer view notify position
            if (getEmptyViewCount() == 1) {
                int position = 1;
                if (mHeadAndEmptyEnable && getHeaderLayoutCount() != 0) {
                    //空布局可见 并且 头布局可见
                    position++;
                }
                if (mFootAndEmptyEnable) {
                    //尾布局可见
                    return position;
                }
            } else {
                //头布局有无:0 or 1 正常项的大小
                return getHeaderLayoutCount() + mData.size();
            }
            return -1;
        }

这些都是些辅助方法,用来判断header和footer的position的,因为加入了EmptyView里面的逻辑需要改动一下,逻辑也比较简单,看代码注释.

## 总结 ##

EmptyView也是比较简单的,**其实就是一个FrameLayout(可以把这个看成是RecyclerView的一个item,其实就是),当外部调用者想使用空布局时传入emptyView,我们直接将该emptyView添加到FrameLayout中,然后刷新adapter(相当于添加了一个item),不就搞定了么.**

[Link 1]: https://github.com/CymChad/BaseRecyclerViewAdapterHelper
[BaseRecyclerViewAdapterHelper_ _adapter_BaseViewHolder]: http://blog.csdn.net/xfhy_/article/details/78274652
[BaseRecyclerViewAdapterHelper_ _header_footer]: http://blog.csdn.net/xfhy_/article/details/78274867
[BaseRecyclerViewAdapterHelper_]: http://blog.csdn.net/xfhy_/article/details/78285701
[BaseRecyclerViewAdapterHelper_ 1]: http://blog.csdn.net/xfhy_/article/details/78305538
[BaseRecyclerViewAdapterHelper_ header_footer]: http://blog.csdn.net/xfhy_/article/details/78322969
[BaseRecyclerViewAdapterHelper_ 2]: http://blog.csdn.net/xfhy_/article/details/78328983
[BaseRecyclerViewAdapterHelper_ 3]: http://blog.csdn.net/xfhy_/article/details/78347347