0

I am trying to do this kind of animation but with fragments

https://i.stack.imgur.com/ky7cQ.gif

I have a fragment A and Fragment B

Fragment A contains a recycler view of pictures. When a picture is pressed, it will go to fragment B.

Fragment B will have the same image but on top of the screen.

I want a transition that moves the selected image to the top to make it seamless.

At the moment it works when going back i.e. from fragment B to fragment A however, it does not work from A to B.

Here is my code

   FragmentB fragmentB = FragmentB.newInstance(someURL);
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            Transition transition = TransitionInflater.from(this).inflateTransition(R.transition.mytransition);

            Fragment fragmenAt = fragmentManager.findFragmentById(R.id.fragmentContainer);
            if(fragmentA != null && fragmentA instanceof FragmentA){
//                fragment.setSharedElementReturnTransition(transition);
//                fragment.setSharedElementEnterTransition(transition);
            }

            fragmentB.setSharedElementEnterTransition(transition);
            if (sharedTransitionElementView != null) {
                fragmentB.setSharedTransitionName(sharedTransitionElementView.getTransitionName());
                fragmentTransaction.addSharedElement(sharedTransitionElementView, sharedTransitionElementView.getTransitionName());
            }

        }

        fragmentTransaction.replace(R.id.fragmentContainer, fragmentB);
        fragmentTransaction.addToBackStack(FragmentB.class.getName());
        fragmentTransaction.commit();

The code above is in my activity.

The steps are to create an instance of fragment B and find Fragment A

Since fragment A is a recycler view, each view item is given a transition name at run time which is passed into Fragment B via the setSharedTransitionName() method

Now the commented lines is where my confusion happens, I do not have a setSharedElementExitTransition.

How can i get the image from fragment A to animate to top of the screen?

Just to repeat, it works when i go back from FragmentA to FragmentB, the image animates from the top to where it was in the list.


UPDATE 1

So i made this change to my transition

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android" android:duration="750" android:startDelay="150" android:interpolator="@android:interpolator/accelerate_decelerate">
    <changeTransform/>
    <slide android:slideEdge="top"/>
    <changeImageTransform/>
    <changeBounds/>
</transitionSet>

And with this line only

fragmentB.setSharedElementEnterTransition(transition);

I seem to get an exit transition for fragment A which i have not set. Can anyone explain why?

Ersen Osman
  • 7,067
  • 8
  • 47
  • 80
  • I haven't used my transition because it became obsolete. That's the only time I've used it an d I can't test your code at the moment. However, if I compare my answer with yours, I see you're not setting a `setSharedElementReturnTransition` and `setExitTransition` on the currently visible fragment (the one that contains the recycler view). `setSharedElementReturnTransition(TransitionInflater.from(getActivity()).inflateTransition(R.transition.change_image_transform)); setExitTransition(TransitionInflater.from(getActivity()).inflateTransition(android.R.transition.explode));` – ar34z Sep 11 '15 at 14:36
  • @ar34z Thanks for the reply. I tried adding these but it did not help :( – Ersen Osman Sep 11 '15 at 15:00
  • Please update your question with what you've done, it helps others and saves them from asking the same. – ar34z Sep 11 '15 at 15:14
  • 1
    @ErsenOsman Have you fixed it? I am having the same problem. Can you share the code? Thanks. – Sudheesh Mohan Jun 03 '16 at 04:19

0 Answers0