Reverse animation for Shared Element transition on Grid Recyclerview always moves to last item

Question

I am using Shared Element transition on click of recyclerview item. On click of item the imageView smoothly transitions to detail activity. However, on clicking back button, the transition for imageView always goes to the last item of the recyclerView. I am not able to understand the reason behind it, any inputs is appreciated.

Here is my code.

<!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowContentTransitions">true</item> </style>

gridItem.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:foreground="?attr/selectableItemBackground">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/recyclerItem"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="@dimen/spacing_xsmall">

        <android.support.v7.widget.AppCompatImageView
            android:id="@+id/categoryImage"
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:layout_gravity="center"
            android:background="@color/colorPrimary"
            android:scaleType="fitXY"
            android:transitionName="AnimateTitle"
            />

        <TextView
            android:id="@+id/title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:gravity="center"
            android:padding="@dimen/spacing_large"
            android:textColor="@color/colorAccent"
            android:textStyle="bold"/>
    </LinearLayout>
</FrameLayout>

DetailActivity.xml

  <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
    tools:context="com.thinkinghats.isittrue.GameActivity"
    >

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_height="56dp"
        android:layout_width="0dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginTop="8dp">

        <android.support.v7.widget.AppCompatImageView
            android:id="@+id/categoryImage"
            android:layout_width="56dp"
            android:layout_height="56dp"
            android:scaleType="fitXY"
            android:transitionName="AnimateTitle"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:id="@+id/title"
            android:textSize="25sp"
            android:textStyle="bold"
            android:textColor="@color/colorAccent"
            />
    </android.support.v7.widget.Toolbar>

    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/tools"
        android:id="@+id/card_question"
        android:layout_width="0dp"
        android:layout_height="300dp"
        android:layout_below="@id/toolbar"
        android:layout_margin="@dimen/spacing_xlarge"
        android:background="@color/white"
        android:clickable="true"
        android:foreground="?attr/selectableItemBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toolbar"
        app:layout_constraintVertical_bias="0.502"
        card_view:cardCornerRadius="4dp">
    </android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>

And this is how i call the transition from MainActivity

public void onItemClick(View view, ViewModel viewModel) {
        Intent startIntent = new Intent(this, DetailActivity.class);
        Bundle bundle = new Bundle();
        bundle.putString("categoryTitle", viewModel.getText());
        bundle.putInt("categoryImage", viewModel.getImage());
        startIntent.putExtras(bundle);          
        startActivity(startIntent,ActivityOptions.makeSceneTransitionAnimation(this,view.findViewById(R.id.categoryImage),"AnimateTitle").toBundle());     
    }

prakashpun prakashpun · Accepted Answer · 2017-07-28T08:43:49

As it turns out I had setup the adapter for recyclerView onEnterAnimationComplete() while trying something. After setting the adapter on onCreate() event the issue is solved.

I am guessing that since the adapter used to get reset onEnterAnimationComplete(), there was no way to for transition to know which item had started it.

Reverse animation for Shared Element transition on Grid Recyclerview always moves to last item

1 Answers