Scrolling a viewpager header above the recyclerview not working

Question

I tried two ways to scroll a viewpager header above a recyclerView. The id of the layout is android:id="@+id/rel_promotions_parent" with the viewPager to be scrolled.

1. Using CoordinatorLayout where the viewpager root layout having app:layout_scrollFlags="scroll|exitUntilCollapsed" and recyclerView with app:layout_behavior="@string/appbar_scrolling_view_behavior"

<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white_one"
    android:fitsSystemWindows="true"

    >

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"

        >

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"

            >

            <RelativeLayout
                android:id="@+id/rel_promotions_parent"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"

                >

                <com.loopingviewpager.LoopingViewPager
                    android:id="@+id/viewpager"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:visibility="visible"
                    app:autoScroll="true"
                    app:isInfinite="true"
                    app:scrollInterval="2000"

                    />

                <com.loopingviewpager.indicator.CustomShapePagerIndicator
                    android:id="@+id/indicator"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@id/viewpager"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="@dimen/_5sdp"
                    android:visibility="visible"
                    app:indicator_spacing="4dp"

                    />

            </RelativeLayout>

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="5dp"
        android:clipToPadding="false"
        android:paddingStart="5dp"
        android:paddingEnd="5dp"
        android:paddingBottom="10dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"


        />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

2. Using motionLayout as an example in the link https://medium.com/@alex.gabor applying the constrainSet to the layout android:id="@+id/rel_promotions_parent"

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white_one"

    >

    <androidx.constraintlayout.motion.widget.MotionLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layoutDescription="@xml/scrollable_header_above_recycler_view_scene"

        >

        <RelativeLayout
            android:id="@+id/rel_promotions_parent"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"

            >

            <com.loopingviewpager.LoopingViewPager
                android:id="@+id/viewpager"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:visibility="visible"
                app:autoScroll="true"
                app:isInfinite="true"
                app:scrollInterval="2000"

                />

            <com.loopingviewpager.indicator.CustomShapePagerIndicator
                android:id="@+id/indicator"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignBottom="@id/viewpager"
                android:layout_centerHorizontal="true"
                android:layout_marginBottom="@dimen/_5sdp"
                android:visibility="visible"
                app:indicator_spacing="4dp"

                />

        </RelativeLayout>
        
        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginTop="5dp"
            android:clipToPadding="false"
            android:paddingStart="5dp"
            android:paddingEnd="5dp"
            android:paddingBottom="10dp"
            app:layout_constraintTop_toBottomOf="@id/rel_promotions_parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"

            />
        
    </androidx.constraintlayout.motion.widget.MotionLayout>

</RelativeLayout>

In both the cases only the recyclerView is scrolling, and the viewPager is laying still. If we try to touch and drag the viewpager it will scroll, but not with the help of the recyclerView.

Does anyone knows how to scroll a viewpager header above a recyclerView..?

Answer 1

NestedScrollView was not able to catch the scroll change when recyclerView is placed inside. So while pagination is implemented a lot of memory space is allocated and scrolling is pretty lag. The solution I did is to incorporate the header inside the recyclerView as the first element and then removed the nestedsrollview. Also I implemented the diffUtil class callback for the recyclerview also which did a lot of work for me.

Hope it helps for anyone.