共享元素转换+内容转换

Question

我正在尝试实现类似于gif的东西，可以在以下链接中看到：

Shared Element Transitions Between Views (not Activities or Fragments)

当transition项目上的点击事件在recyclerview内时，fragment需要发生的唯一区别（片段位于{{1}内}}）。 activity然后传播到onClick，activity反过来托管由详细信息组成的实际fragment。

我们如何才能实现这样的动画？

作为参考，这是我的细节xml的样子：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">

    <android.support.v7.widget.CardView

        android:id="@+id/card_view"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dip">

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

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/holo_green_dark"
                android:layout_margin="10dip"
                android:id="@+id/detailsCardTitleNameTextView"
            />

            <include layout="@layout/divider_details"/>

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:text = "@string/director_name"
                android:layout_margin="10dip"
                android:id="@+id/detailsCardDirectorTextView"
            />



            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_margin="10dip"
                android:text="@string/released_date"
                android:id="@+id/detailsCardReleasedTextView"
            />
        </LinearLayout>
    </android.support.v7.widget.CardView>


    <android.support.v7.widget.CardView

        android:id="@+id/card_view5"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dip">

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

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/holo_green_dark"
                android:layout_margin="10dip"
                android:text="@string/writers_title"
                android:id="@+id/detailsCardWriterTitleTextView"
            />

            <include layout="@layout/divider_details"/>

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_margin="10dip"
                android:id="@+id/detailsCardWritersTextView"
            />
        </LinearLayout>
    </android.support.v7.widget.CardView>


    <android.support.v7.widget.CardView

        android:id="@+id/card_view2"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dip">

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


            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/holo_green_dark"
                android:text="@string/plot_title"
                android:layout_margin="10dip"
                android:id="@+id/detailsCardPlotTitleTextView"
            />

            <include layout="@layout/divider_details"/>

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_margin="10dip"
                android:id="@+id/detailsCardPlotTextView"
            />
        </LinearLayout>
    </android.support.v7.widget.CardView>

    <android.support.v7.widget.CardView

        android:id="@+id/card_view3"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dip">

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

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/holo_green_dark"
                android:layout_margin="10dip"
                android:text="@string/imdb_rating"
                android:id="@+id/imdbRatingTitleTextView"
            />

            <include layout="@layout/divider_details"/>

            <TextView
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                android:layout_margin="10dip"
                android:id="@+id/imdbRatingTextView"
            />
        </LinearLayout>
    </android.support.v7.widget.CardView>

</LinearLayout>

任何想法，提示非常感谢。 谢谢！