android imageview 回收,Android RecycleView滚动监听，以及view回收的细节

主要细节是，如果要在recycleView在回收的同时，做UI调整容易出现的问题。

一、xml可见的最外层设置为margin，view的回收还有添加的时间点可能不好计算，容易出现卡顿的情况，

二、如果是实用方法smoothScrollBy，第一个view刚好滚出可视区的时候是没有被回收的，技巧就是滚动距离加1

没图没真相，以下是业务需求的效果

gif5新文件.gif

首先想法是通过behavior解决问题，但是后来发现behavior需要好多个，各种相互观察好麻烦，所以想一下可不可以直接使用RecycleView，通过滚动监听改变图片大小实现功能，初步想法是第一个可视view不断变小，第二个可视的view不断变大，如下图

11.png

12.png

13.png

然后再隐藏第一个视图，setVisibility(View.INVISIBLE)；不是(GONE)，然后在左边RecycleView下面再放一个ImageView显示那个隐藏的view的内容即可

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

android:layout_width="150dp"

android:layout_height="200dp">

android:padding="5dp"

android:id="@+id/first_book"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@color/colorAccent"/>

android:id="@+id/recycle_view"

android:layout_width="match_parent"

android:layout_height="200dp"/>

滚动的初步想法是这样的通过滚动距离dx，来改变view的大小

@Override

public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {

super.onScrolled(recyclerView, dx, dy);

setViewWidth(dx);

}

但是后来发现dx，效果不行，有兴趣的同学自己试一下，所以想了另外一个思路，根据下标为2的view也就是第三本书的位置，修改前面两本书的宽度，所以不需要dx了,这里顺便提一下，书本这个view是重写了ImageView的，把宽高比固定为3:4，所以只需要不断的改变书本的宽度就好了，其中bookWidth 为小书本的原始高度

private void setViewWidth() {

int count = recyclerView.getChildCount();

//获取下标为2的view

View view2 = recyclerView.getChildAt(2);

//获取该view的位置(左上角的坐标)，第一本书是第二本书的两倍大

view2left = view2.getLeft();

if (view2left > bookWidth * 3) {

//理论上讲第三本书的左上角坐标不会超过3倍书的大小，因为超过了，他就不是第三本书而是第四本，

// 但是，因为recycleView的回收和新增view的时间延迟上的问题会出现超过的情况，

// 我们又是通过这个距离来改变前两本书的大小，所以这个值最大只能是bookWidth * 3

view2left = bookWidth * 3;

} else if (view2left < bookWidth * 2) {

view2left = bookWidth * 2;

}

boolean isTop = (view2left>bookWidth*2.8);

for (int i = 0; i < count; i++) {

BookImageView imgBook = recyclerView.getChildAt(i).findViewById(R.id.img_book);

//停止滑动的时候第一本书不需要隐藏，否则隐藏第一本,第一本书的宽度是不断变小的，第二本书的宽度是不断变大的，

//根据业务需求，第一本书必须隐藏，这个地方有个坑，如果xml设置为margin而不是padding的话，会影响第一个view的回收，

// 造成需求上应该被隐藏的view下标被加一，变成不隐藏了，

if (view2left%bookWidth==0){

//单第一本书刚好被滚动出去的时候，第二本书变成第一本书，这个时候第一本书是不能被隐藏的，否则点击事件就没了

imgBook.setVisibility(View.VISIBLE);

}else {

//其他情况下第一本书是处于变小的状态的是要隐藏的

imgBook.setVisibility(i == 0 ? View.INVISIBLE : View.VISIBLE);

}

if (i == 0) {

//更新recycleView下面的ImageView的内容

setFirstView(imgBook.getBook(),isTop);

}

LinearLayout.LayoutParams linearParams = (LinearLayout.LayoutParams) imgBook.getLayoutParams();

//定义view的宽度

int width;

//根据view的下标，以及下标为2的view的位置动态修改，下标为0和1的宽度

if (i == 1) {

width = bookWidth * 4 - view2left;

} else if (i == 0) {

width = view2left - bookWidth;

} else {

width = bookWidth;

}

linearParams.width = width;

imgBook.setLayoutParams(linearParams);

}

//滑动过程中第一本书的动画效果，改变margins

LinearLayout.LayoutParams firstBookLinearParams = (LinearLayout.LayoutParams) firstBook.getLayoutParams();

firstBookLinearParams.setMargins((int) ((bookWidth * 3 - view2left)*0.15 ),

(int) ((bookWidth * 3 - view2left) * 0.1 ),

(int) ((bookWidth * 3 - view2left) * 0.15 ),

(int) ((bookWidth * 3 - view2left) * 0.2 ));

firstBook.setLayoutParams(firstBookLinearParams);

}

到这里基本上就实现了滚动效果了，但是业务需求是当手指不在滑动的时候，不允许书本被覆盖的，所以这里就要，监听滚动状态

@Override

public void onScrollStateChanged(@NonNull RecyclerView r, int newState) {

super.onScrollStateChanged(r, newState);

//如果停止滑动的时候第一本书被覆盖则滑动到不被覆盖为止

if (view2left % bookWidth != 0) {

//判断是往左滑动还是往右

if (bookWidth * 2.5 - view2left < 0) {

recyclerView.smoothScrollBy(view2left - bookWidth * 3, 0);

} else {

//故意加1个像素，原因是如果是左滑到某个item置顶，其实第0个view没被回收，有的事件没有被触发

recyclerView.smoothScrollBy(view2left - bookWidth * 2+1, 0);

}

}

}

这个地方必须使用smoothScrollBy，不能是ScrollBy，因为ScrollBy不会回调onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy)这个方法，造成view宽度没有重新设定。

项目地址:https://gitee.com/feng87/BookShelf