Develop Reference

How to make CollapsingToolbarLayout disappear completely after scrolling?

I'm trying to make a fragment "head" with two toolbars and horizontal scroll view between them. I want to make horizontal scroll view completely disappear after scrolling down but after scrolling there some black space and i don't know why. What attributes should i type to make it?
Here is my layout:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/tool"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:foregroundGravity="center"
android:src="#drawable/ic_arrow" />
</androidx.appcompat.widget.Toolbar>
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:clipToPadding="false"
android:fitsSystemWindows="true"
app:layout_constraintTop_toBottomOf="#id/tool"
tools:context=".ui.menu.MenuFragment">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="220dp"
android:fitsSystemWindows="true"
android:theme="#style/Theme.PizzaTime.AppBarOverlay">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
</LinearLayout>
</HorizontalScrollView>
<androidx.appcompat.widget.Toolbar
android:id="#+id/support_action"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:layout_collapseMode="pin"
app:popupTheme="#style/Theme.PizzaTime.PopupOverlay">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:foregroundGravity="center"
android:src="#drawable/ic_arrow" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/scroll_content" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

After I deleted the following line from CoordinatorLayout:
android:fitsSystemWindows="true"
It started working correctly, hope it will be helpful for someone.

Android Collapsing Toolbar does not collapse

I have the following layout that has a collapsing toolbar with a LinearLayout inside -
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".application_flow.group.GroupOverviewFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:elevation="10dp"
android:fitsSystemWindows="true"
android:stateListAnimator="#animator/show_toolbar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:collapsedTitleGravity="center"
app:contentScrim="#color/colorPrimary"
app:expandedTitleGravity="top"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:title="Lohamei Galipoly 38"
app:titleEnabled="false"
app:toolbarId="#id/group_tasks_toolbar">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="14dp"
android:layout_marginEnd="14dp"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.6">
<androidx.appcompat.widget.Toolbar
android:id="#+id/group_tasks_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStartWithNavigation="0dp"
app:layout_collapseMode="pin"
app:navigationIcon="#drawable/left_arrow_white"
app:titleTextColor="#color/white" />
<Space
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:textColor="#color/white"
android:textSize="18sp"
tools:text="Total group tasks: 8" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/group_tasks_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#color/white"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/white" />
</LinearLayout>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager2.widget.ViewPager2
android:id="#+id/group_tasks_viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</layout>
For some reason it does not collapse the entire content of the LinearLayout like it should and it is being left fixed in place.
This error seemed to start happening after I switched to work with the LinearLayout inside my CollapsingToolbarLayout
What is it that I am missing?

I think you are missing an actual toolbar inside the collapsing toolbar.
try adding a toolbar after the linear layout's closing tag.
example:
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryLight"
android:theme="#style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
app:layout_collapseMode="pin"
app:title="Toolbar title" />
and another thing I noticed, you AppBarLayout has android:fitsSystemWindows="true" so check that as well.

How to handle scrolling with Collapsing Toolbar Layout

I added collapsing toolbar in my app but now it only collapses when a user scrolls the image view inside the CollapsingToolbarLayout. How can collapse the toolbar when a user scrolls from anywhere within the view?
this is my layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.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"
tools:context=".ui.ProfileActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/profile_image"
android:layout_width="match_parent"
android:layout_height="400dp"
android:scaleType="centerCrop"
android:src="#drawable/default_avatar"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/profile_contents"
app:layout_anchor="#+id/app_bar"
app:layout_anchorGravity="bottom"
android:layout_gravity="bottom"
android:layout_height="wrap_content"
android:layout_width="match_parent" />
</android.support.design.widget.CoordinatorLayout>
These are the contents of profile_contents.xml for now because I am going to add more items in future.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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">
<TextView
android:id="#+id/profile_displayName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="loading name..."
android:textColor="#color/black"
android:textSize="24dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/profile_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="loading status..."
android:textColor="#color/black"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/profile_displayName" />
<Button
android:id="#+id/profile_send_req_btn"
android:layout_width="182dp"
android:layout_height="38dp"
android:layout_marginTop="44dp"
android:background="#drawable/profile_button_bg"
android:padding="10dp"
android:text="#string/send_friend_request"
android:textAllCaps="false"
android:textColor="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/profile_status" />
</android.support.constraint.ConstraintLayout>

Put your included layout inside NestedScrollView view, since the ConstraintLayout is not a scrollable view.
Like this:
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom"
app:layout_anchor="#+id/app_bar"
app:layout_anchorGravity="bottom"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/profile_contents"
android:layout_height="wrap_content"
android:layout_width="match_parent" />
</androidx.core.widget.NestedScrollView>
Don't forget to put the app:layout_behavior in the NestedScrollView

Add this in the profile_contents layout's root view
app:layout_behavior="#string/appbar_scrolling_view_behavior"
We need to define an association between the AppBarLayout and the View that will be scrolled. Add an app:layout_behavior to a RecyclerView or any other View capable of nested scrolling such as NestedScrollView. The support library contains a special string resource #string/appbar_scrolling_view_behavior that maps to AppBarLayout.ScrollingViewBehavior, which is used to notify the AppBarLayout when scroll events occur on this particular view. The behavior must be established on the view that triggers the event.
The above text is from here https://guides.codepath.com/android/handling-scrolls-with-coordinatorlayout

Hiding AppBarLayout on RecyclerView Scroll using MaterialDesignComponents

I'm trying to collapse the AppBarLayout when I scroll up the RecyclerView. I'm trying this using Material Design Components.
So here's my code:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.appbar.MaterialToolbar
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:id="#+id/toolbar"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<com.google.android.material.textview.MaterialTextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="18sp"
android:text="#string/app_name"/>
</com.google.android.material.appbar.MaterialToolbar>
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/component_recycler_view"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="24dp"
android:layout_gravity="bottom|end"
android:contentDescription="#string/extended_fab_content_desc"
android:text="#string/extended_fab_label"
app:icon="#drawable/ic_plus_24dp"
app:layout_anchor="#id/component_recycler_view"
app:layout_anchorGravity="bottom|right|end"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="24dp"
android:layout_marginBottom="24dp"
app:layout_constraintBottom_toBottomOf="#id/component_recycler_view"/>
</androidx.constraintlayout.widget.ConstraintLayout>
When I scroll up on the recyclerview, it does scroll up but the appbarlayout does not hide itself. Moreover the topmost item of the RecyclerView is partially hidden behind the AppBarLayout.

You can use CoordinatorLayout to achieve a CollapsingToolbarLayout, something like this:
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/appbar"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="200dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleGravity="bottom"
app:expandedTitleMarginEnd="16dp"
app:expandedTitleMarginStart="16dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:title="#string/choose_hero">
<ImageView
android:id="#+id/toolbar_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:contentDescription="#null"
android:fitsSystemWindows="true"
android:scaleType="centerCrop" />
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I am using this type of layout and my app bar is collapsing/expanding without hiding any recyclerView items.

How to scroll a Recyclerview which is inside multi-level nested fragment and Viewpager?

I am trying to hide a toolbar when i scroll up the recyclerview . This recycler view is inside a Fragment (named Fragment 2) . This fragment gets re-used in a Viewpager with 3 Tabs(re-using the same fragment) which is in a Fragment(named Fragment 1) . Now this Fragment 1 is loaded in a Framelayout which is hosted in an Activity
EDIT 1: Even the recycler view is not scrolling in this case. The last items never show up. I cannot scroll to the end of the last items
I tried using coordinator layouts and Nested scroll view but nothing gave the results.
Activity Main
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.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:background="?attr/MainBG"
android:fitsSystemWindows="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".iccrankings.ICCRankingNew">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_weight="1"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="#string/app_name">
</android.support.v7.widget.Toolbar>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="?attr/cardBGC">
<Spinner
android:id="#+id/spinner_icc_categories"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:dropDownWidth="match_parent"
android:overlapAnchor="false"
android:spinnerMode="dropdown"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</Spinner>
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/main_container_of_ranks_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</android.support.design.widget.CoordinatorLayout>
</android.support.design.widget.CoordinatorLayout>
Fragment 1
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
tools:context=".iccrankings.fragments.RankViewPagerContainerFragment">
<android.support.design.widget.TabLayout
android:id="#+id/tabs_all_matches"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:tabBackground="#drawable/tab_color_selector"
app:tabTextColor="#color/colorAccent">
<android.support.design.widget.TabItem
android:id="#+id/tabItem1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/odi_tab" />
<android.support.design.widget.TabItem
android:id="#+id/tabItem2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test_tab" />
<android.support.design.widget.TabItem
android:id="#+id/tabItem3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/t20_tab" />
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/categoryDataContainerPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tabs_all_matches" />
</android.support.constraint.ConstraintLayout>
Fragment 2
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fillViewport="true"
tools:context=".iccrankings.fragments.IccHumanFragment">
<android.support.v7.widget.RecyclerView
android:id="#+id/icc_human_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</android.support.v7.widget.RecyclerView>
</android.support.design.widget.CoordinatorLayout>
I am attaching an image which illustrates the nested views and desired results which describes the composition of the views and the desired results.
Thanks in advance

You need to add your activities toolbar inside CollapsingToolbarLayout and set required flags for scrolling behavior.
See this page for more details :
https://guides.codepath.com/android/handling-scrolls-with-coordinatorlayout

You should use CollapsingToolbarLayout right in your AppBarLayout.
It should look like this:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:contentScrim="#android:color/transparent"
app:layout_scrollFlags="scroll|snap">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_weight="1"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="#string/app_name">
</android.support.v7.widget.Toolbar>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="?attr/cardBGC">
<Spinner
android:id="#+id/spinner_icc_categories"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:dropDownWidth="match_parent"
android:overlapAnchor="false"
android:spinnerMode="dropdown"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</Spinner>
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

you can achieve that without Collapsing Toolbar, for example you can make your toolbar hide if you scroll down with some code like below:
<android.support.design.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:background="#ddd"
tools:context=".ControllerAdding.ControllerPickerActivity"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:fitsSystemWindows="true">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#df1b39"
app:contentInsetStart="0dp"
app:titleTextColor="#color/pureWhite"
style="#style/RobotoBoldTextAppearance"
app:layout_scrollFlags="scroll|enterAlways">
<TextView
android:id="#+id/textView6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Products List"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
be sure to add app:layout_scrollFlags="scroll|enterAlways" in your Toolbar because if you don't and then you add a RecyclerView here, that Recycler won't be Scrollable.
this is a tested code that i used for my own app, so if you see some styling or ... its because of that.