android recyclerview item动画_Android使用RecyclerView实现类似ViewPager左右滑动效果

论坛 期权论坛 编程之家     
选择匿名的用户   2021-6-2 16:27   2689   0

从 API 16 开始,控件Gallery已被废弃,此时我们可以用RecyclerView实现类似于ViewPager的横向移动。

效果图:

ab658223878a1232b1f80cc68840b649.png

布局文件很简单就一个RecyclerView:

<?xml version="1.0" encoding="utf-8"?>    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.example.hans.hansrecyclergallery.MainActivity"    >          android:id="@+id/rv"      android:layout_marginTop="200dp"      android:layout_width="match_parent"      android:layout_height="wrap_content" >      

实现方案:

1.继承RecyclerView.Adapter实现onCreateViewHolder方法,初始化itemView的大小和透明度:

  @Override public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {    ViewHolder holder = super.onCreateViewHolder(parent, viewType);    // 设置Item的宽度    holder.getConvertView().setScaleX(mScale);    holder.getConvertView().setScaleY(mScale);    holder.getConvertView().setAlpha(mAlpha);    ViewGroup.LayoutParams lp = holder.getConvertView().getLayoutParams();    lp.width = getItemStdWidth();//每个item所占屏幕的宽度    return holder;  }

2.实现onAttachedToRecyclerView(RecyclerView mRecyclerView)方法,

给RecyclerView添加setOnScrollListener监听器,根据RecyclerView滑动的距离实现动画效果:

@Override public void onScrolled(RecyclerView mRecyclerView, int dx, int dy) {        //mCurrentItemOffset += dx;        mCurrentItemOffset = mRecyclerView.computeHorizontalScrollOffset();        mCurrentItemPos = (int) ((mCurrentItemOffset * 1.0 / getItemStdWidth())+0.1f);        mMiddleItemPos = getMiddlePosition();        int offset = (mCurrentItemPos+1)*getItemStdWidth() - mCurrentItemOffset ;        float percent = (float) Math.max(Math.abs(offset)*1.0 / getItemStdWidth(), 0.0001);        if (mMiddleItemPos > 0) {          leftView = mRecyclerView.getLayoutManager().findViewByPosition(mMiddleItemPos - 1);        }        currentView = mRecyclerView.getLayoutManager().findViewByPosition(mMiddleItemPos);        if (mMiddleItemPos < mRecyclerView.getAdapter().getItemCount() - 1) {          rightView = mRecyclerView.getLayoutManager().findViewByPosition(mMiddleItemPos + 1);        }        if (leftView != null) {          // y = (1 - mScale)x + mScale          leftView.setScaleY(mScale);          leftView.setScaleX(mScale);        }        if (currentView != null) {          // y = (mScale - 1)x + 1          currentView.setScaleY((1 - mScale) * percent + mScale);          currentView.setScaleX((1 - mScale) * percent + mScale);          currentView.setAlpha((1 - mAlpha) * percent + mAlpha);        }        if (rightView != null) {          // y = (1 - mScale)x + mScale          rightView.setScaleY((mScale - 1) * percent + 1);          rightView.setScaleX((mScale - 1) * percent + 1);          rightView.setAlpha((mAlpha - 1) * percent + 1);        }        super.onScrolled(mRecyclerView, dx, dy);      }    });    super.onAttachedToRecyclerView(mRecyclerView);  }

3.使用LinearSnapHelper,有点类似 ViewPager,LinearSnapHelper 保证了每次滚动完自动滑动到中心的 Item

new LinearSnapHelper().attachToRecyclerView(recyclerView)

注:LinearSnapHelper支持库,需要把Support RecyclerView包更新到24.2.0以上

我们来看看效果吧:

f968f659ebb301180672f1ba12544906.gif

源码地址:

https://github.com/sugarhans/HansRecyclerGallery

到这里就结束啦.

1ffe135fa0626378ba74a23a74ec6607.png

3340bdafe8dba424d527e165f79d2795.png

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:3875789
帖子:775174
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP