세로형 RecyclerView 안에 가로형 RecyclerView 구현할 때 스크롤이 잘 되지 않을때

스크롤이 잘 되지 않아요!!

Vertical RecyclerView안에 Horizontal RecyclerView를 구현하는 경우 스크롤이 잘되지 않는 경우가 발생할 수 있습니다.

상위/하위 RecyclerView 상호간 터치이벤트 간섭으로 인해 원치 않는 동작이 발생기 때문인데요.

RecyclerView는 NestedScrollingChild 인터페이스의 구현으로 중첩된 스크롤(nested scroll)에 대한 내용을 지원하고 있습니다. RecyclerView가 초기화 되고 중첩스크롤에 대한 기능이 true로 되어있는데 이를 비활성화 해주면 문제가 해결됩니다. 

또한 CoordinatorLayout을 사용하면서 CollapsingToolbarLayout과 AppBarBehavior를 사용하는 경우의 스크롤 오동작도 마찬가지로 하위 RecyclerView의 setNestedScrollingEnabled(false); 를 호출하면 해결이 됩니다.

19.08.19 추가 
원문 : https://rubensousa.com/2019/08/16/nested_recyclerview_part1/

기본 RecyclerView 사용시 아래와 같은 스크롤 이슈가 발생합니다.

문제 1 영상

문제2 영상

수정하는 방법

두 영상에서 보이는 이슈를 모두 해결하기 위해서는 RecyclerView를 상속한 OrientationAwareRecyclerView를 만들고 onInterceptTouchEvent를 재정의 해야합니다.

사용자가 손가락을 움질일때의 스크롤 방향이 RecyclerView의 방향인지 확인해야하는데, 만약 방향이 일치한다면 터치이벤트를 가로채고 아니면 그대로 동작하게 내버려둡니다.

@Override
public boolean onInterceptTouchEvent(MotionEvent e) {
   final LayoutManager lm = getLayoutManager();

   if (lm == null) {
       return super.onInterceptTouchEvent(e);
   }

   boolean allowScroll = true;

   switch (e.getActionMasked()) {
       case MotionEvent.ACTION_DOWN: {
           lastX = e.getX();
           lastY = e.getY();
           // If we were scrolling, stop now by faking a touch release
           if (scrolling) {
               MotionEvent newEvent = MotionEvent.obtain(e);
               newEvent.setAction(MotionEvent.ACTION_UP);
               return super.onInterceptTouchEvent(newEvent);
           }
           break;
       }
       case MotionEvent.ACTION_MOVE: {
           // We're moving, so check if we're trying
           // to scroll vertically or horizontally
           // so we don't intercept the wrong event.
           float currentX = e.getX();
           float currentY = e.getY();
           float dx = Math.abs(currentX - lastX);
           float dy = Math.abs(currentY - lastY);
           allowScroll = dy > dx ? lm.canScrollVertically() : lm.canScrollHorizontally();
           break;
       }
   }

   if (!allowScroll) {
       return false;
   }

   return super.onInterceptTouchEvent(e);
}

위의 코드를 적용하여 문제점을 해결한 영상을 아래에서 확인해보세요.

해결1 영상

해결2 영상

원문 출처의 샘플 Github:https://github.com/rubensousa/RecyclerViewNestedExample/

후원하기