
一 、前言
最近实在太忙,一个多礼拜没有更新文章了,于是今晚加班加点把demo写出来,现在都12点了才开始写文章。
1.我们的目标
把RecyclerVIEw下拉刷新上拉加载更多加入到我们的开发者头条APP中。
2.效果图
3.实现步骤
找一个带上拉刷新下载加载更多的RecyclerVIEw开源库,我们要站在巨人的肩膀上 下载下来自己先运行下demo,然后看看是不是我们需要的功能,觉得不错就把module依赖进来,整合主项目。 整合进来了之后,我们肯定需要进行修改,例如我这边就有滑动冲突,有多个headVIEw等问题。二 、具体实现
1.寻找RecyclerVIEw上拉刷新下载加载开源库
我们找开源项目肯定首选github,去搜索一下一大堆,如果效果图是你想要的功能的话,然后找排名靠前,收藏比较多的项目吧,我找的项目是CommonPullToRefresh,支持ListVIEw,RecyclerVIEw,GrIDVIEw,SwipeRefreshLayout等常用控件。我跑了一下Demo,没啥BUG,挺好用的。
2.加入项目中
1).module导入进来,然后主项目依赖一下,这里有不会的看我另外一篇文章AndroID Studio 入门,里面有讲到AndroID Studio添加项目依赖。
2).代码实现,我们这边就是修改SelectedFragment
首先我们看布局文件的变化,在RecyclerVIEw外面包裹了自定义的一个类PtrClassicFrameLayout,内部实现了下拉刷新,上拉加载更多。还可以设置自定义属性,都是啥意思我就不解释了,有兴趣的点击github上那个链接,讲解的很详细。
<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:orIEntation="vertical"> <com.chanven.lib.cptr.PtrClassicFrameLayout xmlns:cube_ptr="http://schemas.androID.com/apk/res-auto" androID:ID="@+ID/test_recycler_vIEw_frame" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#f0f0f0" cube_ptr:ptr_duration_to_close="200" cube_ptr:ptr_duration_to_close_header="700" cube_ptr:ptr_keep_header_when_refresh="true" cube_ptr:ptr_pull_to_fresh="false"cube_ptr:ptr_ratio_of_header_height_to_refresh="1.2" cube_ptr:ptr_resistance="1.8"> <androID.support.v7.Widget.RecyclerVIEw androID:ID="@+ID/test_recycler_vIEw" androID:layout_wIDth="match_parent" androID:layout_height="match_parent"androID:background="@androID:color/white"/> </com.chanven.lib.cptr.PtrClassicFrameLayout></linearLayout>
再来看onCreateVIEw方法,这个代码就不解释了。
@OverrIDe public VIEw onCreateVIEw(LayoutInflater inflater,VIEwGroup container,Bundle savedInstanceState){ VIEw rootVIEw = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_selected,null); ptrClassicFrameLayout = (PtrClassicFrameLayout) rootVIEw.findVIEwByID(R.ID.test_recycler_vIEw_frame); mRecyclerVIEw = (RecyclerVIEw) rootVIEw.findVIEwByID(R.ID.test_recycler_vIEw); mRecyclerVIEw.setLayoutManager(new linearlayoutmanager(getActivity())); init(); return rootVIEw; }在onCreateVIEw里面调用了init()方法,我们来瞧瞧怎么实现的。这里解释一下为什么要对适配器进行包装,这样的目的在包装类里面处加入头部,底部VIEw,处理点击事件。大家拿到源码了之后自己也可以看看。
private voID init() { //初始化适配器 selectedAdapter = new SelectedRecyclerAdapter(getActivity()); //对适配器进行封装 mAdapter = new RecyclerAdapterWithHF(selectedAdapter); //把滚动Banner加入头部 mAdapter.addCarouse(initCarouselhead()); mRecyclerVIEw.setAdapter(mAdapter); ptrClassicFrameLayout.setPtrHandler(ptrDefaultHandler);//设置下拉监听 ptrClassicFrameLayout.setonLoadMoreListener(onLoadMoreListener);//设置上拉监听 ptrClassicFrameLayout.setLoadMoreEnable(true);//设置可以加载更多 }mAdapter.addCarouse(initCarouselhead()); 初始化一个滚动Banner,然后加入适配器头部。这个我前面的教程应该已经讲过了。。
//初始化 private VIEw initCarouselhead(){ VIEw headVIEw = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_selected_header,mRecyclerVIEw,false); tvContent=(TextVIEw) headVIEw.findVIEwByID(R.ID.tv_content); tvContent.setText(carousePageStr[0]); vIEwPager = (VIEwPager)headVIEw.findVIEwByID(R.ID.vIEwpager); selectedPagerAdapter=new SelectedPagerAdapter(getActivity(),carousePagerSelectVIEw); vIEwPager.setoffscreenPagelimit(2); vIEwPager.setCurrentItem(0); vIEwPager.addOnPagechangelistener(onPagechangelistener); vIEwPager.setAdapter(selectedPagerAdapter); VIEwGroup group = (VIEwGroup) headVIEw.findVIEwByID(R.ID.vIEwGroup);// 初始化底部显示控件 tips = new ImageVIEw[3]; for (int i = 0; i < tips.length; i++){ ImageVIEw imageVIEw = new ImageVIEw(getActivity()); if (i == 0) { imageVIEw.setBackgroundResource(R.mipmap.page_indicator_focused); } else { imageVIEw.setBackgroundResource(R.mipmap.page_indicator_unfocused); } tips[i] = imageVIEw; linearLayout.LayoutParams layoutParams = new linearLayout.LayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT)); layoutParams.leftmargin = 10;// 设置点点点vIEw的左边距 layoutParams.rightmargin = 10;// 设置点点点vIEw的右边距 group.addVIEw(imageVIEw,layoutParams); } timer = new Timer(true);//初始化计时器 timer.schedule(task,CAROUSEL_TIME);//延时0ms后执行,3000ms执行一次 return headVIEw; }SelectedRecyclerAdapter 必须继承RecyclerVIEw.Adapter
这玩意跟ListVIEw的适配器差不多,用过ListVIEw适配器的应该一看就懂了。
首先会调用getItemCount,知道我要显示多少item。
知道了行数然后就是循环调用onCreateVIEwHolder跟onBindVIEwHolder了,onCreateVIEwHolder就是创建一个item的VIEw,onBindVIEwHolder就会把上次创建的item的VIEw传入进来,还有一个下标,这样我们就能给每一行赋值,这两个方法都是先后一起调用。item回收重用的机制应该跟ListVIEw一样的。
public class SelectedRecyclerAdapter extends RecyclerVIEw.Adapter<RecyclerVIEw.VIEwHolder> { private List<SelectedArticle> selectedArticles; private LayoutInflater inflater; public SelectedRecyclerAdapter(Context context) { super(); inflater = LayoutInflater.from(context); selectedArticles = new ArrayList<SelectedArticle>(); initData(); } private voID initData() { for (int i = 0; i < 10; i++) { SelectedArticle selectedArticle = new SelectedArticle(i,"AndroID开发666",i,""); selectedArticles.add(selectedArticle); } } public voID loadMore(int page) { for (int i = 0; i < 5; i++) { SelectedArticle selectedArticle = new SelectedArticle(i,"第" + page + "页数据",""); selectedArticles.add(selectedArticle); } } public voID getFirst() { selectedArticles.clear(); initData(); } @OverrIDe public int getItemCount() { return selectedArticles.size(); } @OverrIDe public voID onBindVIEwHolder(RecyclerVIEw.VIEwHolder vIEwHolder,int position) { SelectedRecyclerHolder holder = (SelectedRecyclerHolder) vIEwHolder; SelectedArticle selectedArticle = selectedArticles.get(position); holder.Title.setText(selectedArticle.getTitle()); holder.like.setText("" + selectedArticle.getlikeNumber()); holder.comment.setText("" + selectedArticle.getCommentNumber()); } @OverrIDe public RecyclerVIEw.VIEwHolder onCreateVIEwHolder(VIEwGroup vIEwHolder,int position) { VIEw vIEw = inflater.inflate(R.layout.fragment_selected_item,null); return new SelectedRecyclerHolder(vIEw); } public class SelectedRecyclerHolder extends RecyclerVIEw.VIEwHolder { private TextVIEw Title;//标题 private TextVIEw like;//喜欢数量 private TextVIEw comment;评论数量 public SelectedRecyclerHolder(VIEw vIEw) { super(vIEw); Title = (TextVIEw) vIEw.findVIEwByID(R.ID.tv_Title); like = (TextVIEw) vIEw.findVIEwByID(R.ID.tv_like); comment = (TextVIEw) vIEw.findVIEwByID(R.ID.tv_comment); } }}3.解决整合进来的BUG
滑动冲突
当我们上拉到顶部把标题栏挤出屏幕外的时候,进行下拉会触发RecyclerVIEw的下拉事件,正确的情况应该是显示Toolbar.
1).RecyclerVIEw下拉刷新的时候先判断Toolbar有没有显示。如果Toolbar没有显示就不处理。
2).AppbarLayout有一个addOnOffsetChangedListener方法,在AppbarLayout的布局偏移量发生改变时被调用。
在MainFragment里面进行监听
appbarLayout= (AppbarLayout) rootVIEw.findVIEwByID(R.ID.appbarLayout);appbarLayout.addOnOffsetChangedListener(onOffsetChangedListener);
然后在回调函数中,把值给SelectedFragment,
private AppbarLayout.OnOffsetChangedListener onOffsetChangedListener=new AppbarLayout.OnOffsetChangedListener() { @OverrIDe public voID onOffsetChanged(AppbarLayout appbarLayout,int i){ //i>=0 Toolbar全部显示 selectedFragment.setPullRefresh(i>=0); System.out.println("i值:"+i); } };3).在SelectedFragment中,继续把值传给PtrFrameLayout
public voID setPullRefresh(boolean pullRefresh) { ptrClassicFrameLayout.setPullRefresh(pullRefresh); }4.在PtrFrameLayout里面用一个实例变量接收这个值
private boolean pullRefresh=true; public voID setPullRefresh(boolean pullRefresh) { this.pullRefresh = pullRefresh; }4).找到PtrFrameLayout类的dispatchtouchEvent事件,这个方法是处理屏幕的触摸事件的。
@OverrIDe public boolean dispatchtouchEvent(MotionEvent e) { if (!isEnabled() || mContent == null || mheaderVIEw == null) { System.out.println("都是空的..."); return dispatchtouchEventSupper(e); } int action = e.getAction(); switch (action) { case MotionEvent.ACTION_UP: System.out.println("d起..."); case MotionEvent.ACTION_CANCEL: System.out.println("取消...");// if(pullRefresh){ mPtrIndicator.onRelease(); if (mPtrIndicator.hasleftStartposition()) { if (DEBUG) { PtrCLog.d(LOG_TAG,"call onRelease when user release"); } System.out.println("call onRelease when user release"); onRelease(false); if (mPtrIndicator.hasMovedAfterpressedDown()) { sendCancelEvent(); return true; } } return dispatchtouchEventSupper(e);// } case MotionEvent.ACTION_DOWN: System.out.println("按下..."); mHasSendCancelEvent = false; mPtrIndicator.onPressDown(e.getX(),e.getY()); mScrollChecker.abortIfWorking(); mPreventForHorizontal = false; // The cancel event will be sent once the position is moved. // So let the event pass to children. // fix #93,#102 return dispatchtouchEventSupper(e); case MotionEvent.ACTION_MOVE: System.out.println("移动..."); if(pullRefresh){//Toolbar显示 mLastMoveEvent = e; mPtrIndicator.onMove(e.getX(),e.getY()); float offsetX = mPtrIndicator.getoffsetX(); float offsetY = mPtrIndicator.getoffsetY(); if (mdisableWhenHorizontalMove && !mPreventForHorizontal && (Math.abs(offsetX) > mPagingtouchSlop && Math.abs(offsetX) > Math.abs(offsetY))) { if (mPtrIndicator.isInStartposition()) { mPreventForHorizontal = true; } } if (mPreventForHorizontal) { return dispatchtouchEventSupper(e); } boolean moveDown = offsetY > 0; boolean moveUp = !moveDown; boolean canMoveUp = mPtrIndicator.hasleftStartposition(); if (DEBUG) { boolean canMoveDown = mPtrHandler != null && mPtrHandler.checkCanDoRefresh(this,mContent,mheaderVIEw); PtrCLog.v(LOG_TAG,"ACTION_MOVE: offsetY:%s,currentPos: %s,moveUp: %s,canMoveUp: %s,moveDown: %s: canMoveDown: %s",offsetY,mPtrIndicator.getCurrentPosY(),moveUp,canMoveUp,moveDown,canMoveDown); } // disable move when header not reach top if (moveDown && mPtrHandler != null && !mPtrHandler.checkCanDoRefresh(this,mheaderVIEw)) { return dispatchtouchEventSupper(e); } if ((moveUp && canMoveUp) || moveDown) {// System.out.println("是否下拉刷新:"+pullRefresh+"偏移量是多少:"+offsetY); movePos(offsetY); return true; } } } return dispatchtouchEventSupper(e); }我就改了一行代码,在action==MotionEvent.ACTION_MOVE的时候,先判断我们传入的pullRefresh是否为true。。。
顶部加入轮播
RecyclerVIEw头部底部加入VIEw,前面我们介绍过了,都是适配器的封装类RecyclerAdapterWithHF来控制。从效果图中,我们可以看出,轮播的VIEw是加入头部的,找到RecyclerAdapterWithHF类,看看源码依葫芦画瓢就可以了。
1).得有一个保存VIEw的集合,其实用一个变量也行,因为我们只有一个轮播VIEw.
private List<VIEw> mCarouse = new ArrayList<VIEw>();//保存轮播VIEw //可以添加轮播VIEw public voID addCarouse(VIEw vIEw){ mCarouse.add(vIEw); }2).定义一个常量,用于类型判断
public static final int TYPE_CAROUSE = 7900;
3).在getItemVIEwType里面加入轮播的类型
@OverrIDe public final int getItemVIEwType(int position) { // check what type our position is,based on the assumption that the // order is headers > items > footers if (isheader(position)) { return TYPE_header; } else if (mCarouse.size()>0&&mheaders.size()==position){ //判断集合个数&&position==0 这个时候mheaders里面是没有值的 return TYPE_CAROUSE; }else if (isFooter(position)) { return TYPE_FOOTER; } int type = getItemVIEwTypeHF(getRealposition(position)); if (type == TYPE_header || type == TYPE_FOOTER|| type == TYPE_CAROUSE) { throw new IllegalArgumentException("Item type cannot equal " + TYPE_header + " or " + TYPE_FOOTER); } return type; }4).onCreateVIEwHolder里面也要修改一下,就是在if里面多加了个&&.无论是头部,底部,轮播的VIEw,都是添加到FrameLayout里面的。
@OverrIDe public final RecyclerVIEw.VIEwHolder onCreateVIEwHolder(VIEwGroup vIEwGroup,int type) { // if our position is one of our items (this comes from // getItemVIEwType(int position) below) if (type != TYPE_header && type != TYPE_FOOTER && type != TYPE_CAROUSE) { VIEwHolder vh = onCreateVIEwHolderHF(vIEwGroup,type); return vh; // else we have a header/footer } else { // create a new framelayout,or inflate from a resource FrameLayout frameLayout = new FrameLayout(vIEwGroup.getContext()); // make sure it fills the space frameLayout.setLayoutParams(new VIEwGroup.LayoutParams(VIEwGroup.LayoutParams.MATCH_PARENT,VIEwGroup.LayoutParams.MATCH_PARENT)); return new headerfooterVIEwHolder(frameLayout); } }5).onBindVIEwHolder这里为item绑定数据,其实就是第四步返回的ItemVIEw绑定数据.
@OverrIDe public final voID onBindVIEwHolder(final RecyclerVIEw.VIEwHolder vh,int position){ // check what type of vIEw our position is if (isheader(position)) { VIEw v = mheaders.get(position); // add our vIEw to a header vIEw and display it prepareheaderfooter((headerfooterVIEwHolder) vh,v); }else if(mCarouse.size()>0&&position==mheaders.size()){//这个时候mheaders.size()值为0// System.out.println("有多少个头VIEw:"+mheaders.size()+"值等于多少:"+(mheaders.size()-1)); VIEw v = mCarouse.get(mheaders.size());//取出轮播的VIEw prepareheaderfooter((headerfooterVIEwHolder) vh,v); } else if (isFooter(position)) { VIEw v = mFooters.get(position - getItemCountHF() - mheaders.size()); // add our vIEw to a footer vIEw and display it prepareheaderfooter((headerfooterVIEwHolder) vh,v); } else { vh.itemVIEw.setonClickListener(new MyOnClickListener(vh)); vh.itemVIEw.setonLongClickListener(new MyOnLongClickListener(vh)); // it's one of our items,display as required onBindVIEwHolderHF(vh,getRealposition(position)); } }6).我们从第五步看到头部底部轮播VIEw最后都会调用prepareheaderfooter方法。看到这方法的源码,其实就是把类型对应的VIEw,添加到Item中.
private voID prepareheaderfooter(headerfooterVIEwHolder vh,VIEw vIEw) { // if it's a staggered grID,span the whole layout if (mManagerType == TYPE_MANAGER_STAGGERED_GRID) { StaggeredGrIDLayoutManager.LayoutParams layoutParams = new StaggeredGrIDLayoutManager.LayoutParams (VIEwGroup.LayoutParams.MATCH_PARENT,VIEwGroup.LayoutParams.WRAP_CONTENT); layoutParams.setFullSpan(true); vh.itemVIEw.setLayoutParams(layoutParams); } // if the vIEw already belongs to another layout,remove it if (vIEw.getParent() != null) { ((VIEwGroup) vIEw.getParent()).removeVIEw(vIEw); } // empty out our FrameLayout and replace with our header/footer vh.base.removeAllVIEws(); vh.base.addVIEw(vIEw); }以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程小技巧!
总结以上是内存溢出为你收集整理的RecyclerView下拉刷新上拉加载全部内容,希望文章能够帮你解决RecyclerView下拉刷新上拉加载所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)