Add Views Below Toolbar in Coordinatorlayout

Add views below toolbar in CoordinatorLayout

Take the attribute

app:layout_behavior="@string/appbar_scrolling_view_behavior"

off the RecyclerView and put it on the FrameLayout that you are trying to show under the Toolbar.

I've found that one important thing the scrolling view behavior does is to layout the component below the toolbar. Because the FrameLayout has a descendant that will scroll (RecyclerView), the CoordinatorLayout will get those scrolling events for moving the Toolbar.

One other thing to be aware of: That layout behavior will cause the FrameLayout height to be sized as if the Toolbar is already scrolled, and with the Toolbar fully displayed the entire view is simply pushed down so that the bottom of the view is below the bottom of the CoordinatorLayout.

This was a surprise to me. I was expecting the view to be dynamically resized as the toolbar is scrolled up and down. So if you have a scrolling component with a fixed component at the bottom of your view, you won't see that bottom component until you have fully scrolled the Toolbar.

So when I wanted to anchor a button at the bottom of the UI, I worked around this by putting the button at the bottom of the CoordinatorLayout (android:layout_gravity="bottom") and adding a bottom margin equal to the button's height to the view beneath the toolbar.

Progressbar below Toolbar in CoordinatorLayout

If you want to hide ProgressBar with Toolbar wrap Toolbar inside LinearLayout and put ProgressBar as a first child of this LinearLayout. Assign

orientation="vertical"

If you would like ProgressBar to be always visible, then wrap RecyclerView inside LinearLayout and put ProgressBar as a first child. Set the orientation. Remember to add

app:layout_behavior="@string/appbar_scrolling_view_behavior"

as a paramter of LinearLayout (It must pass the scrolling to the child)

Hiding view below toolbar in coordinator layout

Moved the top toolbar out of the coordinatorlayout and thus resolved this issue.
(Thanks to a colleague)

<LinearLayout 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:orientation="vertical">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:layout_scrollFlags="scroll|enterAlways"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_done" />

</android.support.design.widget.CoordinatorLayout>

Custom toolbar in CoordinatorLayout

Try This if you does not want to make Toolbar sticky means it will collapse with CollapsingToolbar.

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:layout_marginTop="@dimen/appBarTopMargin"
    android:elevation="@dimen/toolbarElevation"
    app:layout_scrollFlags="scroll|exitUntilCollapsed"  <== Add this line 
    app:contentInsetStart="0dp"
    tools:ignore="UnusedAttribute">

if you want Toolbar to be sticky. then, move your Toolbarout of the main CoordinateLayout.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context=".ui.fragments.MainFragment">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:layout_marginTop="@dimen/appBarTopMargin"
    android:elevation="@dimen/toolbarElevation"
    app:contentInsetStart="0dp"
    tools:ignore="UnusedAttribute">

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

        <ImageView
            android:id="@+id/img_overflow"
            android:layout_width="?attr/actionBarSize"
            android:layout_height="?attr/actionBarSize"
            android:layout_alignParentEnd="true"
            android:scaleType="center"
            android:src="@drawable/icon_menu_border"
            tools:ignore="ContentDescription" />

        <ImageView
            android:id="@+id/img_message"
            android:layout_width="?attr/actionBarSize"
            android:layout_height="?attr/actionBarSize"
            android:scaleType="center"
            android:src="@drawable/icon_message"
            tools:ignore="ContentDescription" />

        <ImageView
            android:id="@+id/img_search"
            android:layout_width="?attr/actionBarSize"
            android:layout_height="?attr/actionBarSize"
            android:layout_toStartOf="@id/img_overflow"
            android:scaleType="center"
            android:src="@drawable/icon_search"
            tools:ignore="ContentDescription" />

        <TextView
            android:id="@+id/toolbar_title"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_toEndOf="@id/img_message"
            android:layout_toStartOf="@id/img_overflow"
            android:fontFamily="sans-serif-medium"
            android:gravity="center_vertical"
            android:text="@string/vouch"
            android:textColor="@color/action_bar_color"
            android:textSize="18sp" />

    </RelativeLayout>

</android.support.v7.widget.Toolbar>

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout 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/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:titleEnabled="false"
            app:toolbarId="@+id/toolbar">

            <android.support.constraint.ConstraintLayout
                android:id="@+id/profile_relative"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="none">

                <Button
                    android:id="@+id/btn_view_contacts"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="8dp"
                    android:layout_marginEnd="8dp"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="8dp"
                    android:text="View Contacts"
                    android:textAllCaps="false"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintHorizontal_bias="0.1"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent" />

                <Button
                    android:id="@+id/btn_edit_profile"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="8dp"
                    android:layout_marginEnd="8dp"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="8dp"
                    android:text="Edit Profile"
                    android:textAllCaps="false"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintHorizontal_bias="0.9"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent" />

            </android.support.constraint.ConstraintLayout>

        </android.support.design.widget.CollapsingToolbarLayout>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:layout_gravity="bottom"
            android:background="@android:color/transparent"
            app:tabGravity="fill"
            app:tabIndicatorColor="@android:color/holo_orange_dark"
            app:tabMaxWidth="0dp"
            app:tabMode="fixed"
            app:tabSelectedTextColor="@android:color/black"
            app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
            app:tabTextColor="@android:color/black" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

    </android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>

</LinearLayout>

Add Views Below Toolbar in Coordinatorlayout