Sync scrolling of multiple RecyclerViews
Here was my solution. The less the code the better...
lvDetail & lvDetail2 are the RecyclerViews you want to keep in sync.
final RecyclerView.OnScrollListener[] scrollListeners = new RecyclerView.OnScrollListener[2];
scrollListeners[0] = new RecyclerView.OnScrollListener( )
{
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy)
{
super.onScrolled(recyclerView, dx, dy);
lvDetail2.removeOnScrollListener(scrollListeners[1]);
lvDetail2.scrollBy(dx, dy);
lvDetail2.addOnScrollListener(scrollListeners[1]);
}
};
scrollListeners[1] = new RecyclerView.OnScrollListener( )
{
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy)
{
super.onScrolled(recyclerView, dx, dy);
lvDetail.removeOnScrollListener(scrollListeners[0]);
lvDetail.scrollBy(dx, dy);
lvDetail.addOnScrollListener(scrollListeners[0]);
}
};
lvDetail.addOnScrollListener(scrollListeners[0]);
lvDetail2.addOnScrollListener(scrollListeners[1]);
I believe it is relevant for you to understand its workings, so I am going to explain the whole procedure that I followed to design my solution. Note that this example is for only two RecyclerViews, but doing it with more is as easy as using an array of RecyclerViews.
The first option that comes to mind is listening for scroll changes on both ScrollViews and, when one of them scrolls, use scrollBy(int x, int y) on the other one. Unfortunately, programmatically scrolling will also trigger the listener, so you'll end up in a loop.
To overcome this problem, you will need to setup an OnItemTouchListener that adds the proper ScrollListener when a RecyclerView is touched, and removes it when the scrolling stops. This works almost flawlessly, but if you perform a quick fling in a long RecyclerView, and then scroll it again before it finishes, only the first scroll will be transferred.
To work around this, you will need to ensure that the OnScrollListener is only added when the RecyclerView is idle.
Let's take a look at the source:
public class SelfRemovingOnScrollListener extends RecyclerView.OnScrollListener {
@Override
public final void onScrollStateChanged(@NonNull final RecyclerView recyclerView, final int newState) {
super.onScrollStateChanged(recyclerView, newState);
if (newState == RecyclerView.SCROLL_STATE_IDLE) {
recyclerView.removeOnScrollListener(this);
}
}
}
This is the class from which you need to extend your OnScrollListeners. This ensures that they are removed when needed.
Then I have the two listeners, one for each RecyclerView:
private final RecyclerView.OnScrollListener mLeftOSL = new SelfRemovingOnScrollListener() {
@Override
public void onScrolled(@NonNull final RecyclerView recyclerView, final int dx, final int dy) {
super.onScrolled(recyclerView, dx, dy);
mRightRecyclerView.scrollBy(dx, dy);
}
}, mRightOSL = new SelfRemovingOnScrollListener() {
@Override
public void onScrolled(@NonNull final RecyclerView recyclerView, final int dx, final int dy) {
super.onScrolled(recyclerView, dx, dy);
mLeftRecyclerView.scrollBy(dx, dy);
}
};
And then upon initialization you can setup the OnItemTouchListeners. It would be better to set up a single listener for the whole view instead, but RecyclerView does not support this. OnItemTouchListeners don't pose a problem anyway:
mLeftRecyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
private int mLastY;
@Override
public boolean onInterceptTouchEvent(@NonNull final RecyclerView rv, @NonNull final
MotionEvent e) {
Log.d("debug", "LEFT: onInterceptTouchEvent");
final Boolean ret = rv.getScrollState() != RecyclerView.SCROLL_STATE_IDLE;
if (!ret) {
onTouchEvent(rv, e);
}
return Boolean.FALSE;
}
@Override
public void onTouchEvent(@NonNull final RecyclerView rv, @NonNull final MotionEvent e) {
Log.d("debug", "LEFT: onTouchEvent");
final int action;
if ((action = e.getAction()) == MotionEvent.ACTION_DOWN && mRightRecyclerView
.getScrollState() == RecyclerView.SCROLL_STATE_IDLE) {
mLastY = rv.getScrollY();
rv.addOnScrollListener(mLeftOSL);
}
else {
if (action == MotionEvent.ACTION_UP && rv.getScrollY() == mLastY) {
rv.removeOnScrollListener(mLeftOSL);
}
}
}
@Override
public void onRequestDisallowInterceptTouchEvent(final boolean disallowIntercept) {
Log.d("debug", "LEFT: onRequestDisallowInterceptTouchEvent");
}
});
mRightRecyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
private int mLastY;
@Override
public boolean onInterceptTouchEvent(@NonNull final RecyclerView rv, @NonNull final
MotionEvent e) {
Log.d("debug", "RIGHT: onInterceptTouchEvent");
final Boolean ret = rv.getScrollState() != RecyclerView.SCROLL_STATE_IDLE;
if (!ret) {
onTouchEvent(rv, e);
}
return Boolean.FALSE;
}
@Override
public void onTouchEvent(@NonNull final RecyclerView rv, @NonNull final MotionEvent e) {
Log.d("debug", "RIGHT: onTouchEvent");
final int action;
if ((action = e.getAction()) == MotionEvent.ACTION_DOWN && mLeftRecyclerView
.getScrollState
() == RecyclerView.SCROLL_STATE_IDLE) {
mLastY = rv.getScrollY();
rv.addOnScrollListener(mRightOSL);
}
else {
if (action == MotionEvent.ACTION_UP && rv.getScrollY() == mLastY) {
rv.removeOnScrollListener(mRightOSL);
}
}
}
@Override
public void onRequestDisallowInterceptTouchEvent(final boolean disallowIntercept) {
Log.d("debug", "RIGHT: onRequestDisallowInterceptTouchEvent");
}
});
}
Note also that, in my particular case, the RecyclerViews are not the first ones to receive the touch event, so I need to intercept it. If this is not your case, you can (should) merge the code from onInterceptTouchEvent(...) into onTouchEvent(...).
Finally, this will cause a crash if your user attempts to scroll your two RecyclerViews at the same time. The best effort-quality solution possible here is to set android:splitMotionEvents="false"
in the direct parent containing the RecyclerViews.
You can see an example with this code here.