'How to hide toolbar while scrolling up using scroll view and attach another view at top

I have static layout of two types of Card view and a toolbar at the top. What I want is when I scroll the screen first of all the toolbar gets hide and then the first card view (let's say card view small) get's attached to the top of the screen and other card views which are inside the scroll view keeps on getting scrolled.

Until the (card view small) type of view is encountered again and then it replaces the already attached card view at top and itself get's attached at the top.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<androidx.coordinatorlayout.widget.CoordinatorLayout 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:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

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

            <androidx.appcompat.widget.Toolbar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_margin="8dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="0dp"
                        android:layout_height="40dp"
                        android:layout_weight="0.5"
                        android:src="@drawable/app_icon" />

                    <EditText
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_weight="2"
                        android:background="@drawable/shape_oval_edit_text"
                        android:drawableLeft="@drawable/ic_search"
                        android:hint="Search for interest groups" />

                    <ImageView
                        android:layout_width="0dp"
                        android:layout_height="40dp"
                        android:layout_weight="0.5"
                        android:src="@drawable/ic_messages" />

                </LinearLayout>

            </androidx.appcompat.widget.Toolbar>

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


        <androidx.cardview.widget.CardView
            android:id="@+id/cardViewTopics"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/appBar"
            android:backgroundTint="#6AFD4D4D">

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

        </androidx.cardview.widget.CardView>


        <ScrollView
            android:id="@+id/scrollView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/cardViewTopics"
            android:fillViewport="true"
            android:scrollbars="none">

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

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

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

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

                <include layout="@layout/feed_layout" />
            </LinearLayout>

        </ScrollView>

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_gravity="bottom"
            app:menu="@menu/bottom_nav_menu" />

    </RelativeLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source