美文网首页Android开发Android技术知识Android开发经验谈
Android开发之头部悬浮的上拉加载,下拉刷新的列表

Android开发之头部悬浮的上拉加载,下拉刷新的列表

作者: 木子饼干 | 来源:发表于2018-07-03 16:56 被阅读105次

    时间悬浮

    带时间戳的列表,要求时间悬浮顶部,动态替换顶部时间如下图,如下图,


    image.png

    布局实现

    多布局实现,时间悬浮为一个布局,数据相关内容为一个布局,这里推荐一个Adapter依赖库BRVAH

        public InformationAdapter(@Nullable List<Information> data) {
        super(data);
        addItemType(ITEM_STICK, R.layout.item_stock_sticky_head);
        addItemType(ITEM_DATA, R.layout.item_information);
    }
    

    根据返回的ItemViewType来加载不同的布局,动态设置时间布局的显示

        @Override
    protected void convert(BaseViewHolder helper, Information item) {
        switch (helper.getItemViewType()) {
            case 1:
                helper.setVisible(R.id.tv_stock_name, true);
                helper.setText(R.id.tv_stock_name, item.pinnedHeaderName);
                break;
            case 2:
                int timeInt = item.getArticle_time();
                String s = String.valueOf(timeInt);
                String time = AppUtils.getStrTime(s);
                helper.setText(R.id.btn_time, time);
                Log.d("haha", "convert: 时间 : " + time);
                Log.d("haha", "convert: " + item.getArticle_title());
                helper.setText(R.id.txt_title, item.getArticle_title()).addOnClickListener(R.id.txt_title);
                helper.setText(R.id.txt_content, item.getArticle_content());
                helper.setText(R.id.txt_zan, " " + item.getArticle_like_count()).addOnClickListener(R.id.txt_zan);
                helper.setText(R.id.txt_kankong, " " + item.getArticle_dislike_count());
                break;
        }
    }
    

    加载数据时根据时间比较,判断当前数据是头部数据还是普通数据,添加进集合中

              case STATE_REFREH:
    
                    timeString = "月";
                    mInformationAdapter.getData().clear();
                    for (Information information : informationList) {
                        String s = transForDate(information.getArticle_time());
                        if (!s.equals(timeString)) {
                            newList.add(new Information(Information.ITEM_STICK, s));
                            timeString = s;
                        }
                        Log.d(TAG, "showData: " + s);
                        information.setItemType(Information.ITEM_DATA);
                        newList.add(information);
    
                    }
                    mInformationAdapter.addData(newList);
                    break;
    

    注意数据的判断,正确进行头部数据的添加。

    头部布局的创建

      mHeaderItemDecoration = new PinnedHeaderItemDecoration.Builder(Information.ITEM_STICK).create();
        mRecyclerCoinCircle.addItemDecoration(mHeaderItemDecoration);
    

    时间戳转换

        public static String transForDate(Integer ms) {
        String str = "";
        if (ms != null) {
            long msl = (long) ms * 1000;
            SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
    
            if (ms != null) {
                try {
                    str = sdf.format(msl);
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        }
    
        String[] split = str.split("-");
        StringBuffer stringBuffer = new StringBuffer();
        stringBuffer.append(split[1] + "月").append(split[2] + "日");
        return stringBuffer.toString();
    }
    

    将时间转化为xx月xx日的格式

    文本展开与收起

    默认情况下,最多只显示四行文本如下


    image.png

    点击之后,展开所有文本


    image.png

    具体实现如下:

         TextView textView = (TextView) adapter.getViewByPosition(mRecyclerCoinCircle, position, R.id.txt_content);
        if (textView != null) {
            if (isClick.containsKey(position)) {
                if (isClick.get(position)) {
                    textView.setMaxLines(4);
                    isClick.put(position, false);
                } else {
                    textView.setMaxLines(1000);
                    isClick.put(position, true);
                }
            } else {
                textView.setMaxLines(1000);
                isClick.put(position, true);
            }
        }
    

    下拉刷新,上拉加载自定义布局

    设置下拉刷新,下拉加载的布局

        mEasyLayout.setRefreshHeadView(new RefreshHeaderView(this));
        mEasyLayout.setLoadMoreView(new LoadMoreView(this));
    

    具体实现可参考Demo,或者依赖库文档
    刷新之后回调

            mEasyLayout.addEasyEvent(new EasyRefreshLayout.EasyEvent() {
            @Override
            public void onRefreshing() {
                page =1;
                state = STATE_REFREH;
                getReFreshData();
                new Handler().postDelayed(new Runnable() {
                    @Override
                    public void run() {
    
                        mEasyLayout.refreshComplete();
                    }
                }, 1000);
    
            }
    
            @Override
            public void onLoadMore() {
                page++;
                state = STATE_MORE;
                getInformationData();
    
                new Handler().postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        mEasyLayout.loadMoreComplete();
                    }
                }, 1000);
    
            }
    
        });
    

    下拉加载,上拉刷新布局如图,具体可运行demo查看


    image.png image.png

    爬过的坑

    在头部悬浮,结合上拉刷新下拉加载过程中,遇到过上拉加载,导致头部悬浮布局错位,先前采用
    SmartRefreshLayout,由于SmartRefreshLayout上拉加载会将布局向上顶,导致悬浮布局错误,调试无果后,采用EasyRefreshLayout

    总结

    头部悬浮的上拉加载,下拉刷新的列表主要实现采用Adapter依赖库BRVAH及其推荐相关库EasyRefreshLayoutRecyclerView粘性标签库。其他更多用法,可以自行访问相关库学习。
    最后给出DEMO.

    相关文章

      网友评论

        本文标题:Android开发之头部悬浮的上拉加载,下拉刷新的列表

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