RecyclerView 滚动时图像布局混乱？教你一招轻松解决！

2024-03-24 11:01:44

使用 RecyclerView 滚动时图像布局混乱的解决方案

引言

在使用 RecyclerView 滚动时，如果使用 scrollToPosition 方法，有时会出现布局混乱的问题，导致图像无法填满屏幕，并且会显示下一张图像的一半。然而，如果使用 smoothScrollToPosition 方法，则不会出现此问题。

本文将深入探讨这个问题并提供一种可行的解决方案，帮助您在使用 scrollToPosition 时避免布局混乱。

问题

预期行为：
图像调整大小以填满屏幕，只显示当前页面。
使用 scrollToPosition 时的异常：
图像无法填满屏幕，并且会显示下一张图像的一半。

尝试过的解决方案

使用 SnapHelper 和 calculateDistanceToFinalSnap，但效果不佳。

解决方案

最终，我们找到了一种有效的方法来解决此问题：

调用 scrollToPositionWithOffset(pageNumber+2) 将列表滚动到指定页面的下一个元素。
使用 smoothScrollToPosition(pageN) 将列表平滑滚动到指定的页面。

public void goToPage(int pageId) {
    if (pageId <= 606 && pageId >= 0) {
        LinearLayoutManager manager = (LinearLayoutManager) imageRecycleView.getLayoutManager();
        
        if (pageId - 2 <= 0) {
            manager.scrollToPositionWithOffset(pageId + 2, 0);
        } else {
            manager.scrollToPositionWithOffset(pageId - 2, 0);
        }

        imageRecycleView.postDelayed(() -> {
            imageRecycleView.smoothScrollToPosition(pageId);
        }, 200 * 1);
    }
}