how to hide a recyclerview when another scrolls

hello I'm trying to implement 2 recycler view in one layout, one is horizontal on the top of the layout and below that is the second which is vertical, what I want is when the vertical recycler view scrolls the horizontal will remain hide until the vertical comes back to the starting position

Here is a solution i tried but there is an issue where animation is kind of wierd where the first scroll is laggy (sory i dindt find a good word to describe it) where after scrolling the first item then its back to normal and smoth and also after scrolling first item if scroll back to the top it dosent scrolls completly to the top only till the first item

here is a Screen Recording of the issue

 verticalRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(@NonNull @NotNull RecyclerView recyclerView, int dx, int dy) {
                if (recyclerView.canScrollVertically(-1)) {
                    horizontalRecyclerView.setVisibility(View.GONE);
                    view_all.setVisibility(View.GONE);
                } else {
                    if (!(horizontalRecyclerView.getVisibility() == View.VISIBLE)) {
                        horizontalRecyclerView.setVisibility(View.VISIBLE);
                        view_all.setVisibility(View.VISIBLE);


                    }
                }
            }
        });

here is my code

fragment_home.xml

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/black">


    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <include
            android:id="@+id/toolbar"
            layout="@layout/tool_bar" />
    </com.google.android.material.appbar.AppBarLayout>

    <TextView
        android:id="@+id/view_all_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/appBarLayout"
        android:layout_alignParentEnd="true"
        android:layout_marginEnd="20dp"
        android:layout_marginTop="10dp"
        android:text="@string/view_all"
        android:textColor="@color/white"
        android:textStyle="bold" />

    <!--    Horizontal RecyclerView-->
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/postRecyclerView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/view_all_text"
        android:background="@color/black"
        android:orientation="horizontal"
        android:overScrollMode="never"
        app:reverseLayout="true" />
    <!--    Vertical RecyclerView-->
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerViewHome"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/postRecyclerView1"
        android:layout_marginBottom="10dp"
        android:orientation="vertical"
        android:overScrollMode="never"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior" />

    <com.facebook.shimmer.ShimmerFrameLayout
        android:id="@+id/shimmerEffect"
        android:layout_below="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">


        <include layout="@layout/post_item_container_shimmer_home" />

        <include layout="@layout/post_item_container_shimmer_home" />


    </com.facebook.shimmer.ShimmerFrameLayout>
</RelativeLayout>

post_item_container_home.xml

<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="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true">

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/Card_View"
        android:layout_width="match_parent"
        android:layout_height="500dp"
        android:layout_marginStart="5dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome"
        tools:ignore="ObsoleteLayoutParam">

        <com.google.android.material.imageview.ShapeableImageView
            android:id="@+id/imagePostHome"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:adjustViewBounds="true"
            android:contentDescription="@string/todo"
            app:layout_constraintDimensionRatio="H,16:9"
            app:shapeAppearanceOverlay="@style/RoundedCornerHome" />

    </com.google.android.material.card.MaterialCardView>

    <com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_below="@+id/Card_View"
        android:layout_marginStart="5dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        android:layout_marginBottom="10dp"
        android:background="@color/grey"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome">


    </com.google.android.material.card.MaterialCardView>


</RelativeLayout>

from how to hide a recyclerview when another scrolls