How to collapse the toolbar while I'm scrolling through a RecyclerView in ConstraintLayout?

Question

I have an activity where I have set NavigationDrawer and works fine. This activity hosts a fragment where I have used:

setHasOptionsMenu(true);

To enable the menu. I have added a SearchView and override onCreateOptionsMenu():

@Override
public void onCreateOptionsMenu(@NonNull Menu menu, @NonNull MenuInflater inflater) {
    super.onCreateOptionsMenu(menu, inflater);
    inflater.inflate(R.menu.menu, menu);
    MenuItem searchItem = menu.findItem(R.id.search);
    //Do some search stuff
}

And everything works fine. This the layout file of my fragment:

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

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Now I want to collapse the toolbar while I'm scrolling through the RecyclerView. I know I can add an AppBarLayout and inside it a Toolbar in my layout file, but is the any possibility to achieve the same behaviour with the existing one in a ConstraintLayout?

Answer 1

You can do this with the help of CordinaterLayout.Kindly Check out this answer.

Hide AppBar when scrolling down

Answer 2

 <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  xmlns:app="http://schemas.android.com/apk/res-auto">

<androidx.core.widget.NestedScrollView
  android:layout_width="match_parent"
  android:layout_height="match_parent">

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>
 </androidx.core.widget.NestedScrollView>

 <ProgressBar
    android:id="@+id/progress_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

 </androidx.constraintlayout.widget.ConstraintLayout>

Use this layout in fragment (Wrap Recyclerview in Nestedscrollview).

In main layout use AppbarLyaout inside Coordinator layout Like this

  <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:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/DashCoor"
        android:fitsSystemWindows="true"
        tools:context=".Activities.DashboardActivity">


        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


            <com.google.android.material.appbar.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:visibility="gone"
                app:expandedTitleMarginStart="48dp"
                app:expandedTitleMarginEnd="64dp"
                app:layout_scrollFlags="scroll|enterAlways|snap"
                >
                ​


               //Layout to be collpased

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

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:titleTextColor="@color/white"
                android:fitsSystemWindows="true"
                android:minHeight="?attr/actionBarSize"
                app:theme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_scrollFlags="scroll|enterAlways|snap"
                />

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

         </androidx.coordinatorlayout.widget.CoordinatorLayout>

Hope you solve it :)

Answer 3

With CoordinatorLayout:

The best thing would have been to use a CoordinatorLayout. A similar question here should be able to help you out.

Since you want to achieve that with ConstraintLayout:

You would have to create an OnScrollListener class for your RecyclerView. The class would have an onScrolled() method which would have parameters - dx, dy, the amounts of horizontal and vertical scrolls. Here is a link on how you can follow through with.

Hope it helps :)