New android Support Design Library, scroll tablayout offscreen not working

Question

Trying to use the new support design library. In my layout I want the ToolBar to stay at the top of the screen, but have the TabLayout go off the screen when the user scrolls down. But it looks like the ViewPager goes underneath the AppBarLayout. I used this blog post for reference https://medium.com/ribot-labs/exploring-the-new-android-design-support-library-b7cda56d2c32

This is the layout, within the ViewPager holds Fragments that consist of recycler views

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="@color/material_grey50"
android:clickable="true">

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

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tabLayout" />


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


    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_list"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"

        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />


    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/toolbar_list"
        android:background="?attr/colorPrimary"
        android:scrollbars="horizontal"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:layout_scrollFlags="scroll|enterAlways"
        app:tabGravity="center" />


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


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab_post"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_gravity="bottom|right"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:elevation="3dp"
    android:src="@drawable/ic_videocam_white_36dp"
    app:backgroundTint="@color/accent"
    app:fabSize="normal" />

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

Answer 1

Don't forget to set this in the viewpager:

app:layout_behavior="@string/appbar_scrolling_view_behavior"