android 上下折叠效果,android项目中如何实现给RecyclerView加上折叠效果

本文介绍了如何在Android项目中为RecyclerView添加折叠效果,包括重叠效果、层次感和首项差动效果的实现方法。通过自定义ParallaxRecyclerView,设置ItemDecoration实现重叠,利用CardView的setCardElevation设置层次感,以及在滑动监听中处理首项的差动效果。
摘要由CSDN通过智能技术生成

android项目中如何实现给RecyclerView加上折叠效果

发布时间:2020-11-23 17:38:59

来源:亿速云

阅读:159

作者:Leah

android项目中如何实现给RecyclerView加上折叠效果?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

效果

83c8f164ad99126f408a3e9a0c500a25.gif

总结一下这个列表的特点,就是以下三点:

1. 重叠效果;

2. 层次感;

3. 首项的差动效果。

下面我们来一个个解决。

我们新建一个ParallaxRecyclerView,让它继承RecyclerView,并使用LinearLayoutManager作为布局管理器。

重叠效果

其实就是每一项都搭一部分在它前面那项而已。我们知道,RecyclerView可以通过设置ItemDecoration来实现列表的间隔效果,有没有想过要是把间隔设为负数会怎么样?比如:

addItemDecoration(new ItemDecoration() {

@Override

public void getItemOffsets(Rect outRect, View view, RecyclerView parent, State state) {

super.getItemOffsets(outRect, view, parent, state);

outRect.bottom = -dp2px(context, 10);

}

});

没错,这就实现了我们的重叠效果。

层次感

在Material Design里是有Z轴这个概念的,我们可以给控件设置垂直于屏幕的高度,让不在同一高度的控件看起来有层次感。当然,我们要用Material Design的控件才有这个属性,这里我用的是CardView。

我们给ParallaxRecyclerView增加一个滑动监听,在onScrolled方法里面做如下设置:

LinearLayoutManager layoutManager = (LinearLayoutManager) recyclerView.getLayoutManager();

int firstPosition = layoutManager.findFirstVisibleItemPosition();

int lastPosition = layoutManager.findLastVisibleItemPosition();

int visibleCount = lastPosition - firstPosition;

//重置控件的高度

int elevation = 1;

for (int i = firstPosition - 1; i <= (firstPosition + visibleCount) + 1; i++) {

View view = layoutManager.findViewByPosition(i);

if (view != null) {

if (view instanceof CardView) {

((CardView) view).setCardElevation(dp2px(context, elevation));

elevation += 5;

}

}

}

其中,setCardElevation方法就是用来给CardView设置高度的,这里让每一项的高度比它的上一项高5dp。

首项的差动

最后,我们想给第一项增加一个差动效果,这个同样在onScrolled方法里面做处理就好了:

View firstView = layoutManager.findViewByPosition(firstPosition);

float firstViewTop = firstView.getTop();

firstView.setTranslationY(-firstViewTop / 2.0f);

这样相当于第一项的滑动速度变成原来的一半。但这也会导致一个问题, 由于改变了控件的位置,当这个控件被复用时,会出现位置不正确的情况。所以我们在设置高度的时候,可以顺便把控件的位置复原了:

float translationY = view.getTranslationY();

if (i > firstPosition && translationY != 0) {

view.setTranslationY(0);

}

看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注亿速云行业资讯频道,感谢您对亿速云的支持。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值