How to create AppBarLayout which overlaps content of CoordinatorLayout

Question

When using a CoordinatorLayout with AppBarLayout on some activities I need the content to be under the AppBarLayout, i.e. the Toolbar is using some transparent color and overlays the content. By default CoordinatorLayout + AppBarLayout arrange things so that toolbar and scrolling content are next to eachother, without any overlapping.

Android developer guides have the documentation on this here and it looks like this (but those flags do not seem to work with Toolbar and appcompat - I tried):

So I need something that looks like on image above, but with all the scrolling goodies provided by CoordinatorLayout + AppBarLayout. And there's no need to use CollapsingToolbarLayout - just this simple one.

Any hints on how to achieve this? Here's my activity layout.

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/top_content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.AppBarLayout
        android:background="@android:color/transparent"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <include layout="@layout/main_toolbar"/>
    </android.support.design.widget.AppBarLayout>
    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        >
        <!-- to be filled by content fragment -->
    </FrameLayout>
    <android.support.design.widget.FloatingActionButton
        style="@style/FabStyle"
        android:id="@+id/fab_button"
        android:src="@drawable/bt_filters"
        />
</android.support.design.widget.CoordinatorLayout>

Answer 1

I tried this solution, it works.

transparency : added background to AppBarLayout, and placed scrolling view in layout before AppBarLayout

<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00000000" >

content positioning : extended AppBarLayout.ScrollingViewBehavior by new AppbBarTransparentScrollingViewBehavior overriding onDependentViewChanged() and modifying updateOffset() to offset = 0

@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, View child,
        View dependency) {
    updateOffset(parent, child, dependency);
    return false;
}

private boolean updateOffset(CoordinatorLayout parent, View child,
        View dependency) {
    final CoordinatorLayout.Behavior behavior = ((CoordinatorLayout.LayoutParams) dependency
            .getLayoutParams()).getBehavior();
    if (behavior instanceof Behavior) {
        // Offset the child so that it is below the app-bar (with any
        // overlap)
        final int offset = 0;   // CHANGED TO 0
        setTopAndBottomOffset(offset);
        return true;
    }
    return false;
}

new content's behavior : set behavior on scrolling view

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

result : with an ImageView inside a NestedScrollView as scrolling view