讓你明明白白的使用RecyclerView——SnapHelper詳解
一、前言
Google最新發布的support v4包更新到24.2.0,由原來的一個大包分割成多個小module。這樣做真是太貼心不過了,以後不會再因為單獨使用某一個功能而將整個v4包匯入專案中,而是我想用哪個就匯入哪個,很大程度上減小了APK的大小。
com.android.support:support-compat:24.2.0
com.android.support:support-core-utils:24.2.0
com.android.support:support-core-ui:24.2.0
com.android.support:support-media-compat:24.2.0
com.android.support:support-fragment:24.2.0
SnapHelper就是這次更新裡面的一個,其實它是對RecyclerView功能的一種拓展。
想要詳細瞭解其他更新的,可以點選這個連結
二、SnapHelper介紹
SnapHelper的實現原理是監聽RecyclerView.OnFlingListener中的onFling介面。LinearSnapHelper是抽象類SnapHelper的具體實現。
通過LinearSnapHelper,可以使RecyclerView實現類似ViewPager的功能,無論怎麼滑動最終停留在某頁正中間。
區別就在於,ViewPager一次只能滑動一頁,RecyclerView+SnapHelper方式可以實現一次滑動好幾頁。
三、實現效果
這裡主要是介紹實現兩種效果。
- 自帶的LinearSnapHelper實現
可以看到類似ViewPager,將某頁居中顯示,實現也是很簡單,只要下面的兩行程式碼
LinearSnapHelper mLinearSnapHelper = new LinearSnapHelper();
mLinearSnapHelper.attachToRecyclerView(mRecyclerView);
- 1
- 2
自定義SnapHelper實現
既然可以居中顯示,那我們能不能讓它橫向左對齊顯示呢,答案當然是可以的,這就需要我們自己定義一個左對齊的SnapHelper。
先來看個效果,o(∩_∩)o 哈哈。
四、實現過程
SnapHelper 是一個抽象類,直接繼承需要實現三個方法:
當拖拽或滑動結束時會回撥該方法,返回一個out = int[2],out[0]x軸,out[1] y軸 ,這個值就是需要修正的你需要的位置的偏移量
public abstract int[] calculateDistanceToFinalSnap(@NonNull LayoutManager layoutManager, @NonNull View targetView);上面方法有一個targetView吧 就是這個方法返回的
public abstract View findSnapView(LayoutManager layoutManager);用於Fling,根據速度返回你要滑到的position
public abstract int findTargetSnapPosition(LayoutManager layoutManager, int velocityX, int velocityY);
但是,我們不直接繼承SnapHelper,而是繼承它的實現類LinearSnapHelper,程式碼如下:
/**
* Created by hiwhitley on 2016/9/4.
*/
public class MySnapHelper extends LinearSnapHelper {
private OrientationHelper mHorizontalHelper;
@Nullable
@Override
public int[] calculateDistanceToFinalSnap(RecyclerView.LayoutManager layoutManager, View targetView) {
int[] out = new int[2];
if (layoutManager.canScrollHorizontally()) {
out[0] = distanceToStart(targetView, getHorizontalHelper(layoutManager));
} else {
out[0] = 0;
}
return out;
}
private int distanceToStart(View targetView, OrientationHelper helper) {
return helper.getDecoratedStart(targetView) - helper.getStartAfterPadding();
}
@Nullable
@Override
public View findSnapView(RecyclerView.LayoutManager layoutManager) {
return findStartView(layoutManager, getHorizontalHelper(layoutManager));
}
private View findStartView(RecyclerView.LayoutManager layoutManager,
OrientationHelper helper) {
if (layoutManager instanceof LinearLayoutManager) {
int firstChild = ((LinearLayoutManager) layoutManager).findFirstVisibleItemPosition();
int lastChild = ((LinearLayoutManager) layoutManager).findLastVisibleItemPosition();
if (firstChild == RecyclerView.NO_POSITION) {
return null;
}
if (lastChild == layoutManager.getItemCount() - 1) {
return layoutManager.findViewByPosition(lastChild);
}
View child = layoutManager.findViewByPosition(firstChild);
if (helper.getDecoratedEnd(child) >= helper.getDecoratedMeasurement(child) / 2
&& helper.getDecoratedEnd(child) > 0) {
return child;
} else {
return layoutManager.findViewByPosition(firstChild + 1);
}
}
return super.findSnapView(layoutManager);
}
private OrientationHelper getHorizontalHelper(
@NonNull RecyclerView.LayoutManager layoutManager) {
if (mHorizontalHelper == null) {
mHorizontalHelper = OrientationHelper.createHorizontalHelper(layoutManager);
}
return mHorizontalHelper;
}
}
基本就是參考著自帶的LinearSnapHelper實現的,
這裡有幾點需要特別注意一下,
第11~24行:我們只考慮橫向左對齊,所以只要處理out[0]的值,distanceToStart()方法返回修正的偏移量。
第41~43行:這是為了解決當翻到最後一頁的時候,最後一個Item不能完整顯示的問題(不信,你可以註釋了試試就知道啦)。
if (lastChild == layoutManager.getItemCount() - 1) {
return layoutManager.findViewByPosition(lastChild);
}
第47~52行:得到此時需要左對齊顯示的條目
if (helper.getDecoratedEnd(child) >= helper.getDecoratedMeasurement(child) / 2
&& helper.getDecoratedEnd(child) > 0) {
return child;
} else {
return layoutManager.findViewByPosition(firstChild + 1);
}
最後只要用上我們自己的SnapHelper,就可以輕鬆搞定了。
MySnapHelper mMySnapHelper = new MySnapHelper();
mMySnapHelper.attachToRecyclerView(mRecyclerView);
五、原始碼下載
GitHub下載
原始碼下載
如果您覺得對你有所幫助,歡迎Star和留言,來鼓勵一下我。o(∩_∩)o
六、拓展閱讀
//***************************這是我的用法:**************************************
這是我的recyclerView橫向滑動位置控制器的地址連結: