android - Android material design "hero" transition with scrollview

Question

Im trying to get a decent looking material design animation like shown here: https://developer.android.com/training/material/animations.html

I've set up my RecyclerView and populated it with items created my DetailActivity. As explained here: https://stackoverflow.com/a/26666067/2326538 I pass both my CardView Layout and my ImageView as shared elements to the transition, but it is not working:

Intent intent = new Intent(activity, NewsDetailActivity.class);
intent.putExtra(EXTRA_PARAM_ID, (int) id);

ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity,
        Pair.create(contentView, "contentView"),
        Pair.create(sharedView, "imageView")
);
activity.startActivityForResult(intent, REQUEST_CODE, options.toBundle());

It just flickers and it seems like all views other that the ImageView slide to the top and cover the navigation bar.

Here's the layout file for the list item:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"

    android:id="@+id/news_list_item_cv"
    android:layout_width="match_parent"
    android:layout_height="365dp"
    android:layout_margin="5dp"
    android:foreground="?attr/selectableItemBackground"

    card_view:cardUseCompatPadding="true"
    card_view:cardElevation="1.5dp"
    card_view:cardCornerRadius="2dp">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false">

        <com.android.volley.toolbox.NetworkImageView
            android:id="@+id/news_list_item_image"
            android:layout_width="match_parent"
            android:layout_height="178dp"
            android:scaleType="centerCrop" />

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="16dp">

            <TextView
                android:id="@+id/news_list_item_title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:singleLine="false"
                android:maxLines="2"
                android:textColor="@color/primaryText"
                android:textSize="18sp"
                android:textStyle="normal" />

            <TextView
                android:id="@+id/news_list_item_subtitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:ellipsize="end"
                android:singleLine="false"
                android:maxLines="3"
                android:textColor="@color/secondaryText"
                android:textSize="14sp"
                android:textStyle="normal"/>
        </LinearLayout>

    </LinearLayout>

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

And here's my DetailActivity:

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"

    android:id="@+id/news_detail_root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.github.ksoichiro.android.observablescrollview.ObservableScrollView
        android:id="@+id/news_detail_scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="@dimen/flexible_space_image_height"
        android:clipToPadding="false">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:orientation="vertical"

            android:paddingTop="@dimen/activity_vertical_margin"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:background="@android:color/white">

            <TextView
                android:id="@+id/news_detail_image_desc_textView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="@dimen/activity_vertical_margin"
                android:textAppearance="@style/TextAppearance.AppCompat.Small"/>

            <TextView
                android:id="@+id/news_detail_title_textView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="@dimen/activity_vertical_margin"
                android:textAppearance="@style/TextAppearance.AppCompat.Large"/>

            <TextView
                android:id="@+id/news_detail_article_textView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Body1"
                android:textIsSelectable="true" />

        </LinearLayout>

    </com.github.ksoichiro.android.observablescrollview.ObservableScrollView>

    <!-- declare the header layout -->
    <FrameLayout
        android:id="@+id/news_header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="@dimen/flexible_space_image_height"
            android:layout_marginBottom="36dp"
            android:background="@android:color/white"
            android:elevation="4dp">

            <de.tobiaserthal.akgbensheim.ui.widget.BackdropNetworkImageView
                android:id="@+id/news_header_imageView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"/>

            <TextView
                android:id="@+id/news_header_title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_above="@+id/news_header_subtitle"
                android:layout_marginLeft="16dp"
                android:layout_marginStart="16dp"
                android:gravity="center_vertical"

                android:textAppearance="@style/TextAppearance.AppCompat.Title.Inverse"
                android:text="@string/title_activity_news_detail"/>

            <TextView
                android:id="@+id/news_header_subtitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"

                android:layout_marginBottom="6dp"
                android:layout_marginLeft="16dp"
                android:layout_marginStart="16dp"
                android:layout_marginRight="128dp"
                android:layout_marginEnd="128dp"

                android:gravity="center_vertical"
                android:singleLine="true"
                android:ellipsize="end"
                android:textAppearance="@style/TextAppearance.AppCompat.Subhead.Inverse"/>

        </RelativeLayout>

        <!-- declare floating action button -->
        <com.melnykov.fab.FloatingActionButton
            android:id="@+id/news_detail_action_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="12dp"
            android:scaleType="centerInside"
            android:src="@drawable/abc_ic_menu_share_mtrl_alpha"
            app:fab_colorNormal="?attr/colorAccent"
            app:fab_colorRipple="@color/ripple_material_dark"/>
    </FrameLayout>

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@android:color/transparent"

        android:elevation="5dp"
        android:theme="@style/Widget.AppTheme.Toolbar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</FrameLayout>