How to use layout_below in CoordinatorLayout

Question

hello im trying to use layout below in CoordinatorLayout but it dosent work like relativelayout i tried this solution but didnt worked for me

in my layout i have three main elements one is a tool bar then there is a horizontal recycler view then there is a vertical recyclerview ,the horizontal one should hide when vertical scrolls there is some issue in relativelayout where the scroll is not smoth but after implementing CoordinatorLayout the scroll is smoth but the horizontal is now showing behind the verticlal and top

EDIT

i have tried a answer its working but still there is a issue where the scroll for the vertical recyclerview is not smoth here is Here is the screen recording for refrence

EDIT 2

Ok the question i asked is about CoordinatorLayout but im facing many issues with it and becuase in the future i may include more views in the layout and that can be a hastle for me ,so now i replaced CoordinatorLayout with relativelayout but there is a small issue with the scroll animation of the vertical recyclerview which is almost same that i shown in the video the minor change is now there is a text view above the horizontal one

here is the code

    <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/black"
    tools:ignore="ExtraText">

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

        <include
            android:id="@+id/tool_bar"
            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: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" />

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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

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

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

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

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

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

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

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

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

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

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

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

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

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

        </LinearLayout>

    </com.facebook.shimmer.ShimmerFrameLayout>

</RelativeLayout>

Java Code for recyclerview

//        this is for one item per scroll Vertical RecyclerView
        SnapHelper snapHelper = new PagerSnapHelper();
        snapHelper.attachToRecyclerView(verticalRecyclerView);
//        TextView
        view_all.setOnClickListener(v -> requireActivity().getSupportFragmentManager().beginTransaction()
                .replace(R.id.fragment_container, Search_Fragment.class, null)
                .addToBackStack(String.valueOf(new Home_Fragment()))
                .commit());

//        Method For Hiding Horizontal RecyclerView When Vertical RecyclerView Scrolls
        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);


                    }
                }
            }
        });

Answer 1

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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="@android:color/black">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

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

    <!-- NESTED SCROLLVIEW -->
    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:fillViewport="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/appBarLayout">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/view_all_text"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:text="TOP TEXTVIEW"
                android:textColor="@color/white"
                android:textStyle="bold"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <!--    Horizontal RecyclerView-->
            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/postRecyclerView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:overScrollMode="never"
                app:layout_constraintTop_toBottomOf="@id/view_all_text"
                app:reverseLayout="true" />

            <!--    Vertical RecyclerView-->
            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/recyclerViewHome"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:orientation="vertical"
                android:overScrollMode="never"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintTop_toBottomOf="@id/postRecyclerView1" />

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

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">

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

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

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

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

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

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

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

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

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

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

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

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

                    <include layout="@layout/post_item_container_shimmer_home" />
                </LinearLayout>
            </com.facebook.shimmer.ShimmerFrameLayout>
        </androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 2

Coordinator Layout is like a FrameLayout. Attributes of RelativeLayout not work on it.

Add this line to your AppBarLayout

app:layout_behavior="com.google.android.material.appbar.AppBarLayout$Behavior"

Add a RelativeLayout like below and put your views inside that and use attributes of RelativeLayout

    <RelativeLayout
        android:id="@+id/relative_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
    
    </RelativeLayout>