Android实现单个滚动条同步控制3个RecyclerView滚动

核心思路 #

自定义滚动条View，通过监听RecyclerView的滚动事件同步滚动条位置；同时处理滚动条的触摸拖拽事件，将滚动比例同步到所有关联的RecyclerView，调用LayoutManager.scrollToPositionWithOffset实现精准滚动。

步骤1：自定义滚动条View #

创建LinkedScrollBar类，负责绘制滚动滑块、处理触摸事件，并与RecyclerView绑定：

public class LinkedScrollBar extends View {
    private int scrollBarHeight;
    private int scrollBarY;
    private boolean isDragging;
    private final Paint paint;
    private final List<RecyclerView> linkedRecyclerViews = new ArrayList<>();
    private int totalScrollRange;

    public LinkedScrollBar(Context context) {
        super(context);
        paint = initPaint();
    }

    public LinkedScrollBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        paint = initPaint();
    }

    private Paint initPaint() {
        Paint paint = new Paint();
        paint.setColor(Color.parseColor("#888888"));
        paint.setAntiAlias(true);
        paint.setCornerRadius(10f);
        return paint;
    }

    // 添加需要关联的RecyclerView
    public void addLinkedRecyclerView(RecyclerView rv) {
        linkedRecyclerViews.add(rv);
        rv.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {
                updateScrollBarPosition();
            }
        });
    }

    // 根据RecyclerView滚动位置更新滚动条
    private void updateScrollBarPosition() {
        if (linkedRecyclerViews.isEmpty()) return;
        RecyclerView rv = linkedRecyclerViews.get(0);
        RecyclerView.LayoutManager layoutManager = rv.getLayoutManager();
        if (!(layoutManager instanceof LinearLayoutManager)) return;

        LinearLayoutManager llm = (LinearLayoutManager) layoutManager;
        int scrollOffset = llm.computeVerticalScrollOffset();
        totalScrollRange = llm.computeVerticalScrollRange();
        int viewportHeight = rv.getHeight() - rv.getPaddingTop() - rv.getPaddingBottom();

        // 计算滚动条高度和位置
        scrollBarHeight = (int) ((float) viewportHeight / totalScrollRange * getHeight());
        scrollBarHeight = Math.max(scrollBarHeight, 60); // 限制最小高度，避免滑块过小
        scrollBarY = (int) ((float) scrollOffset / totalScrollRange * (getHeight() - scrollBarHeight));
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // 绘制滚动滑块
        float barLeft = getWidth() - 16;
        canvas.drawRoundRect(barLeft, scrollBarY, getWidth(), scrollBarY + scrollBarHeight, 10f, 10f, paint);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                if (event.getX() >= getWidth() - 16) {
                    isDragging = true;
                    syncRecyclerViewScroll(event.getY());
                    return true;
                }
                break;
            case MotionEvent.ACTION_MOVE:
                if (isDragging) {
                    syncRecyclerViewScroll(event.getY());
                    return true;
                }
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_CANCEL:
                isDragging = false;
                break;
        }
        return super.onTouchEvent(event);
    }

    // 将滚动条位置同步到所有RecyclerView
    private void syncRecyclerViewScroll(float y) {
        float scrollRatio = Math.max(0f, Math.min(1f, y / (getHeight() - scrollBarHeight)));
        int targetScrollOffset = (int) (scrollRatio * totalScrollRange);

        for (RecyclerView rv : linkedRecyclerViews) {
            RecyclerView.LayoutManager layoutManager = rv.getLayoutManager();
            if (!(layoutManager instanceof LinearLayoutManager)) continue;

            LinearLayoutManager llm = (LinearLayoutManager) layoutManager;
            // 计算目标位置和偏移量
            int firstVisiblePos = llm.findFirstVisibleItemPosition();
            View firstView = llm.findViewByPosition(firstVisiblePos);
            if (firstView == null) continue;

            int itemHeight = firstView.getHeight();
            int targetPos = targetScrollOffset / itemHeight;
            int offset = targetScrollOffset % itemHeight;

            llm.scrollToPositionWithOffset(targetPos, -offset);
        }

        scrollBarY = (int) (scrollRatio * (getHeight() - scrollBarHeight));
        invalidate();
    }
}

步骤2：布局中添加滚动条和RecyclerView #

在XML布局里横向排列3个RecyclerView和自定义滚动条：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <RecyclerView
        android:id="@+id/rv_left"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:paddingHorizontal="8dp"/>

    <RecyclerView
        android:id="@+id/rv_middle"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:paddingHorizontal="8dp"/>

    <RecyclerView
        android:id="@+id/rv_right"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:paddingHorizontal="8dp"/>

    <com.your.package.LinkedScrollBar
        android:id="@+id/linked_scroll_bar"
        android:layout_width="16dp"
        android:layout_height="match_parent"
        android:background="#f5f5f5"/>
</LinearLayout>

步骤3：代码中关联滚动条与RecyclerView #

在Activity/Fragment中初始化RecyclerView，并绑定到滚动条：

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    LinkedScrollBar scrollBar = findViewById(R.id.linked_scroll_bar);
    RecyclerView rvLeft = findViewById(R.id.rv_left);
    RecyclerView rvMiddle = findViewById(R.id.rv_middle);
    RecyclerView rvRight = findViewById(R.id.rv_right);

    // 给三个RecyclerView设置相同的线性布局管理器
    LinearLayoutManager layoutManager = new LinearLayoutManager(this);
    rvLeft.setLayoutManager(layoutManager);
    rvMiddle.setLayoutManager(new LinearLayoutManager(this));
    rvRight.setLayoutManager(new LinearLayoutManager(this));

    // 绑定滚动条和RecyclerView
    scrollBar.addLinkedRecyclerView(rvLeft);
    scrollBar.addLinkedRecyclerView(rvMiddle);
    scrollBar.addLinkedRecyclerView(rvRight);

    // 设置Adapter（确保三个列表的item数量和高度一致，同步效果更准确）
    rvLeft.setAdapter(new YourListAdapter(dataList1));
    rvMiddle.setAdapter(new YourListAdapter(dataList2));
    rvRight.setAdapter(new YourListAdapter(dataList3));
}

关键注意事项 #

• Item高度一致性：如果三个RecyclerView的item高度不同，滚动同步会出现偏差，建议统一item布局或使用computeVerticalScrollOffset等方法动态计算滚动比例。
• 横向滚动适配：如果需要横向同步滚动，只需将代码中的垂直方向API替换为水平方向（如computeHorizontalScrollOffset、scrollToPositionWithOffset的水平参数）。
• 性能优化：如果RecyclerView数据量极大，可在滚动监听中添加防抖处理，避免频繁调用invalidate。

内容的提问来源于stack exchange，提问作者Ndond