viewpager 自定义翻页效果_Android RecyclerView自定义LayoutManager
在第一篇中已经讲过,LayoutManager
主要用于布局其中的Item,在LayoutManager
中能够对每个Item的大小,位置进行更改,将它放在我们想要的位置,在很多优秀的效果中,都是通过自定义LayoutManager
来实现的,比如:
Github: https://github.com/dongjunkun/RecyclerViewAccentFirst
可以看到效果非常棒,通过这一节的学习,大家也就理解了自定义LayoutManager
的方法,然后再理解这些控件的代码就不再难了。
在这节中,我们先自己制作一个LinearLayoutManager
,来看下如何自定义LayoutManager
,下节中,我们会通过自定义LayoutManager
来制作第一个滚轮翻页的效果。
自定义CustomLayoutManager
先生成一个类CustomLayoutManager
,派生自LayoutManager
:
public class CustomLayoutManager extends LayoutManager { @Override public LayoutParams generateDefaultLayoutParams() { return null; }}
当我们派生自LayoutManager时,会强制让我们生成一个方法generateDefaultLayoutParams
。这个方法就是RecyclerView
Item的布局参数,换种说法,就是RecyclerView 子 item 的 LayoutParameters
,若是想修改子Item的布局参数(比如:宽/高/margin/padding
等等),那么可以在该方法内进行设置。一般来说,没什么特殊需求的话,则可以直接让子item自己决定自己的宽高即可(wrap_content)。
public class CustomLayoutManager extends LayoutManager { @Override public LayoutParams generateDefaultLayoutParams() { return new RecyclerView.LayoutParams(RecyclerView.LayoutParams.WRAP_CONTENT, RecyclerView.LayoutParams.WRAP_CONTENT); }}
如果这时候,我们把上节demo中LinearLayoutManager
替换下:
public class LinearActivity extends AppCompatActivity { private ArrayList mDatas = new ArrayList<>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState); setContentView(R.layout.activity_linear); ………… RecyclerView mRecyclerView = (RecyclerView) findViewById(R.id.linear_recycler_view); mRecyclerView.setLayoutManager(new CustomLayoutManager()); RecyclerAdapter adapter = new RecyclerAdapter(this, mDatas); mRecyclerView.setAdapter(adapter); } …………}
运行一下,发现页面完全空白:
我们说过所有的Item的布局都是在LayoutManager
中处理的,很明显,我们目前在CustomLayoutManager
中并没有布局任何的Item。当然没有Item出现了。
onLayoutChildren()
在LayoutManager
中,所有Item的布局都是在onLayoutChildren()
函数中处理的,所以我们在CustomLayoutItem
中添加onLayoutChildren()
函数:
@Overridepublic void onLayoutChildren(RecyclerView.Recycler recycler, RecyclerView.State state) { //定义竖直方向的偏移量 int offsetY = 0; for (int i = 0; i View view = recycler.getViewForPosition(i); addView(view); measureChildWithMargins(view, 0, 0); int width = getDecoratedMeasuredWidth(view); int height = getDecoratedMeasuredHeight(view); layoutDecorated(view, 0, offsetY, width, offsetY + height); offsetY += height; }}
在这个函数中,我主要做了两个事:第一:把所有的item所对应的view加进来:
for (int i = 0; i View view = recycler.getViewForPosition(i); addView(view); …………}
第二:把所有的Item摆放在它应在的位置:
public void onLayoutChildren(RecyclerView.Recycler recycler, RecyclerView.State state) { //定义竖直方向的偏移量 int offsetY = 0; for (int i = 0; i ………… measureChildWithMargins(view, 0, 0); int width = getDecoratedMeasuredWidth(view); int height = getDecoratedMeasuredHeight(view); layoutDecorated(view, 0, offsetY, width, offsetY + height); offsetY += height; }}
measureChildWithMargins(view, 0, 0);
函数测量这个View,并且通过getDecoratedMeasuredWidth(view)
得到测量出来的宽度,需要注意的是通过getDecoratedMeasuredWidth(view)
得到的是item+decoration
的总宽度。如果你只想得到view的测量宽度,通过View.getMeasuredWidth()
就可以得到了。
然后通过layoutDecorated()
函数将每个item摆放在对应的位置,每个Item的左右位置都是相同的,从左侧x=0
开始摆放,只是y的点需要计算。所以这里有一个变量offsetY
,用以累加当前Item之前所有item的高度。从而计算出当前item的位置。这个部分难度不大,就不再细讲了。
在此之后,我们再运行程序,会发现,现在item显示出来了:
添加滚动效果
但是,现在还不能滑动,如果我们要给它添加上滑动,需要修改两个地方:
@Overridepublic boolean canScrollVertically() { return true;}
@Overridepublic int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) { // 平移容器内的item offsetChildrenVertical(-dy); return dy;}
我们通过在canScrollVertically()
中return true;
使LayoutManager
具有垂直滚动的功能。然后scrollVerticallyBy
中接收每次滚动的距离dy。如果你想使LayoutManager具有横向滚动的功能,可以通过在canScrollHorizontally()
中`return true;``
这里需要注意的是,在scrollVerticallyBy
中,dy表示手指在屏幕上每次滑动的位移。
- 当手指由下往上滑时,dy>0
- 当手指由上往下滑时,dy<0
当手指向上滑动时,我们需要让所有子Item向上移动,向上移动明显是需要减去dy的。所以,大家经过测试也可以发现,让容器内的item移动-dy距离,才符合生活习惯。在LayoutManager中,我们可以通过public void offsetChildrenVertical(int dy)
函数来移动RecycerView
中的所有item。
现在我们再运行一下:
这里虽然实现了滚动,但是Item到顶之后,仍然可以滚动,这明显是不对的,我们需要在滚动时添加判断,如果到顶了或者到底了就不让它滚动了。
判断到顶
判断到顶相对比较容易,我们只需要把所有的dy相加,如果小于0,就表示已经到顶了。就不让它再移动就行,代码如下:
private int mSumDy = 0;@Overridepublic int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) { int travel = dy; //如果滑动到最顶部 if (mSumDy + dy 0) { travel = -mSumDy; } mSumDy += travel; // 平移容器内的item offsetChildrenVertical(-travel); return dy;}
在这段代码中,通过变量mSumDy 保存所有移动过的dy,如果当前移动的距离<0,那么就不再累加dy,直接让它移动到y=0的位置,因为之前已经移动的距离是mSumdy; 所以计算方法为:
travel+mSumdy = 0;=> travel = -mSumdy
所以要将它移到y=0的位置,需要移动的距离为-mSumdy
,效果如下图所示:
从效果图中可以看到,现在在到顶时,就不会再移动了。下面再来看看到底的问题。
判断到底
判断到底的方法,其实就是我们需要知道所有item的总高度,用总高度减去最后一屏的高度,就是到底的时的偏移值,如果大于这个偏移值就说明超过底部了。
所以,我们首先需要得到所有item的总高度,我们知道在onLayoutChildren
中会测量所有的item并且对每一个item布局,所以我们只需要在onLayoutChildren
中将所有item的高度相加就可以得到所有Item的总高度了。
private int mTotalHeight = 0;public void onLayoutChildren(RecyclerView.Recycler recycler, RecyclerView.State state) { //定义竖直方向的偏移量 int offsetY = 0; for (int i = 0; i View view = recycler.getViewForPosition(i); addView(view); measureChildWithMargins(view, 0, 0); int width = getDecoratedMeasuredWidth(view); int height = getDecoratedMeasuredHeight(view); layoutDecorated(view, 0, offsetY, width, offsetY + height); offsetY += height; } //如果所有子View的高度和没有填满RecyclerView的高度, // 则将高度设置为RecyclerView的高度 mTotalHeight = Math.max(offsetY, getVerticalSpace());}private int getVerticalSpace() { return getHeight() - getPaddingBottom() - getPaddingTop();}
getVerticalSpace()
函数可以得到RecyclerView用于显示Item的真实高度。而相比上面的onLayoutChildren
,这里只添加了一句代码:mTotalHeight = Math.max(offsetY, getVerticalSpace());
这里只所以取最offsetY
和getVerticalSpace()
的最大值是因为,offsetY
是所有item的总高度,而当item填不满RecyclerView时,offsetY应该是比RecyclerView
的真正高度小的,而此时的真正的高度应该是RecyclerView本身所设置的高度。
接下来就是在scrollVerticallyBy
中判断到底并处理了:
public int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) { int travel = dy; //如果滑动到最顶部 if (mSumDy + dy 0) { travel = -mSumDy; } else if (mSumDy + dy > mTotalHeight - getVerticalSpace()) { travel = mTotalHeight - getVerticalSpace() - mSumDy; }
mSumDy += travel; // 平移容器内的item offsetChildrenVertical(-travel); return dy;}
mSumDy + dy > mTotalHeight - getVerticalSpace()
中:mSumDy + dy
表示当前的移动距离,mTotalHeight - getVerticalSpace()
表示当滑动到底时滚动的总距离;
当滑动到底时,此次的移动距离要怎么算呢? 算法如下:
travel + mSumDy = mTotalHeight - getVerticalSpace();
即此将将要移动的距离加上之前的总移动距离,应该是到底的距离。=> travel = mTotalHeight - getVerticalSpace() - mSumDy;
现在再运行一下代码,可以看到,这时候的垂直滑动列表就完成了:
从列表中可以看出,现在到顶和到底可以继续滑动的问题就都解决了。下面贴出完整的CustomLayoutManager
代码,供大家参考:
package com.example.myrecyclerview;
import android.util.Log;import android.view.View;
import androidx.recyclerview.widget.RecyclerView;
public class CustomLayoutManager extends RecyclerView.LayoutManager {
@Override public RecyclerView.LayoutParams generateDefaultLayoutParams() { return new RecyclerView.LayoutParams(RecyclerView.LayoutParams.WRAP_CONTENT, RecyclerView.LayoutParams.WRAP_CONTENT); }
private int mTotalHeight = 0;
public void onLayoutChildren(RecyclerView.Recycler recycler, RecyclerView.State state) { //定义竖直方向的偏移量 int offsetY = 0; for (int i = 0; i View view = recycler.getViewForPosition(i); addView(view); measureChildWithMargins(view, 0, 0); int width = getDecoratedMeasuredWidth(view); int height = getDecoratedMeasuredHeight(view); layoutDecorated(view, 0, offsetY, width, offsetY + height); offsetY += height; } //如果所有子View的高度和没有填满RecyclerView的高度, // 则将高度设置为RecyclerView的高度 mTotalHeight = Math.max(offsetY, getVerticalSpace()); }
private int getVerticalSpace() { return getHeight() - getPaddingBottom() - getPaddingTop(); }
@Override public boolean canScrollVertically() { return true; }
private int mSumDy = 0;
@Override public int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) { int travel = dy; //如果滑动到最顶部 if (mSumDy + dy 0) { travel = -mSumDy; } else if (mSumDy + dy > mTotalHeight - getVerticalSpace()) { travel = mTotalHeight - getVerticalSpace() - mSumDy; } mSumDy += travel; // 平移容器内的item offsetChildrenVertical(-travel); return dy; }}
完!
---END---
更文不易,点个“在看”支持一下?
viewpager 自定义翻页效果_Android RecyclerView自定义LayoutManager相关推荐
- ViewPager实现翻页效果导航点
ViewPager实现翻页效果&导航点 代码下载:https://jww.lanzous.com/i37TMos71uf or: https://download.csdn.net/downl ...
- viewpager 自定义翻页效果_轻松打造专业的录音棚效果,连网红用了都说好的唱吧声卡K10套装...
不得不说,近几年来的网红文化的盛行,随着智能手机的普及,我们在不知不觉中,已经步入了这个人人都是自媒体的时代,而短视频以及直播APP的风行,已经让更多普通人迷上了直播为生活带来的无限乐趣.可能,就是在 ...
- android滑动切换卡片,一步步实现Viewpager卡片翻页效果
这个CardStackViewpager的灵感来自Github上面的 FlippableStackView开源项目,而我想实现的效果方向上刚好与FlippableStackView相反,而且细节上也有 ...
- android fragment实现翻书效果,viewpager实现翻页效果(fragment)
viewpager的运用核心在于适配器的编写,及最终的setadapter(adapter) 谷歌官方认为,ViewPager应该和Fragment一起使用时,此时ViewPager的适配器是Frag ...
- IOS开发之--UIScrollView pagingEnabled自定义翻页宽度
用到UIScrollview的翻页效果时,有时需要显示一部分左右的内容,但是UIScrollView的PagingEnabled只能翻过整页,下面几个简单的设置即可实现 技术点: 1. 创建一个继承U ...
- C#在控件中绘制矩形、圆、线段等(切换不同的图片,自定义翻页控件,通过委托监控某个字段)
1.效果展示 2 自定义翻页控件 public partial class PageManagemen : UserControl{/// <summary>/// 当前页(从1开始计数) ...
- ViewPager实现滑动翻页效果
实现ViewPager的滑动翻页效果可以使用ViewPager的setPageTransformer方法,如下: import android.content.Context; import andr ...
- android做题imageview缩放,巧用ViewPager实现驾考宝典做题翻页效果
效果如下所示: 思路: a.利用ViewPager自带的动画效果,略作修改,实现滑动覆盖翻页效果. b.移动时加入阴影效果. 1.关键代码如下所示: public class ReaderViewPa ...
- android 右侧点击翻页,巧用ViewPager实现驾考宝典做题翻页效果
效果如下所示: 思路: a.利用ViewPager自带的动画效果,略作修改,实现滑动覆盖翻页效果. b.移动时加入阴影效果. 1.关键代码如下所示: public class ReaderViewPa ...
最新文章
- Hadoop_MapReduce的基本应用
- vb.net限制datagridview不能选择_家里安装200兆宽带,网速还是很慢怎么办?教你一招解除网速限制...
- 前端小白的 docker 配置nginx踩坑之旅
- Web前端遍历对象应该如何操作呢?
- JS----JavaScript中函数
- 湍流退化图像复原如何使用matlab,湍流退化图像复原技术研究现状及展望
- linux下硬盘安装ubuntu,Ubuntu硬盘安装
- 星云STS 常用配置
- 淘宝客APP带自营商城本地生活CPS外卖优惠电影票话费更新渠道跟单生活特权V3
- selenium+phantomjs截长图踩坑
- win7开启不了Aero
- YOLO v2算法详解
- 网络发现不了其他计算机,win10网络发现不了其他电脑怎么办_win10网络里找不到其他电脑如何处理...
- 一个毕业生的年终总结
- 【Nginx服务优化与防盗链】
- 如何在vscode中暴躁的使用leetcode
- 大数据常用的软件工具有哪些?
- C++保存中间结果到文件
- Android核心功能
- 【业务理解】什么是SPU、SKU、SKC
热门文章
- 设置build.gradle打包时自动加时间
- ThinkPHP5模型操作中的自动时间戳总结
- hdu 4502 一维dp
- C语言中printf(built: %s %s,__TIME__,__DATE__);方便调试
- [转载]ubuntu 12.10 软件源更新列表
- 牛客15187 分元宵 (快速幂)
- LeetCode 1431. 拥有最多糖果的孩子
- 【剑指offer】面试题03:数组中重复的数字(java)
- python中反斜杠_Python中的正斜杠/与反斜杠\
- 3种团队分组适应项目_业务团队怎样做目标管理?更能激励员工?(附实操方法)...