Shared Item Transition not working in fragment on back : <p>I'm working on an Android app with the <a href="https://www.toptal.com/android/android-fragment-navigation-pattern" rel="noreferrer">Fragment Navigation Pattern</a> (one Activity with many Fragments). I've managed to implement <em>Shared Item Transitions</em> by following <a href="https://medium.com/@bherbst/fragment-transitions-with-shared-elements-7c7d71d31cbb" rel="noreferrer">this guide</a> but they <strong>only work going forward, not on hitting back.</strong></p>

<p>My Fragment (called <code>UserFragment</code>) is composed of a <code>ViewPager</code> with 3 more fragments with RecyclerViews. Clicking any item in the RecyclerViews opens another <code>UserFragment</code> with the same views. The transition works perfectly when switching to the new fragment, but <strong>I'm unable to get it to work when closing it</strong>. When hitting back, the fragment simply fades out and the previous fragment fades in.</p>

<h2>TL;DR:</h2>

<ul>
<li>The Shared Element in question is the Circular Image View on top</li>
<li>Its <code>transitionName</code> is <em>profile</em></li>
<li><code>SharedItemTransition</code> is a custom class that extends <code>TransitionSet</code></li>
<li>I've given each item in each recyclerview unique transition names, by including their user id, list type and position index (and if they weren't unique, it also wouldn't work going forward)</li>
</ul>

<hr>

<p>Here's the <code>onBindViewHolder</code> method of my <strong>RecyclerView Adapter:</strong></p>

<pre><code>public void onBindViewHolder(final UserViewHolder uvh, int position) {
    final LocUser user = users.get(position);
    String transition  = "user_" + user.id() + "_type_" + type + "_item_" + position + "_profile_image";

    uvh.name.setText(user.name());
    uvh.username.setText(user.handle());

    Global.setImage(uvh.userImage, user.profileImage());
    ViewCompat.setTransitionName(uvh.userImage, transitionName(position));

    uvh.root.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            activity.openUserProfile(user, uvh.userImage);
        }
    });
}
</code></pre>

<hr>

<p>Here's my <strong>activity method</strong> that invokes the <code>FragmentManager</code> and starts the animation:</p>

<pre><code>public void openUserProfile(LocUser user, ImageView view) {
    UserProfileFragment uf = UserProfileFragment.create(user);

    uf.setExitTransition(new Fade());
    uf.setEnterTransition(new Fade());
    uf.setSharedElementEnterTransition(new SharedItemTransition());
    uf.setSharedElementReturnTransition(new SharedItemTransition());

    getSupportFragmentManager()
        .beginTransaction()
        .addSharedElement(view, "profile")
        .replace(R.id.container, uf)
        .addToBackStack(null)
        .commit();
}
</code></pre>

<hr>

<p>This is what it looks like:</p>

<p><a href="https://i.stack.imgur.com/FJ9DC.png" rel="noreferrer"><img src="https://i.stack.imgur.com/FJ9DC.png" alt="Screenshot"></a></p>
