Problems with fragment transitions

Question

I have two fragments in an activity and I want the first one to gracefully slide out of view through the left of the screen while the second enters through the right of the screen. I am using the Transitions API and this is what happens:

Initial Screen:

Initial screen

Transition occurs poorly:

Transition occurs poorly

My code is given below:

HomeFragment savedHomeFragment = (HomeFragment) getSupportFragmentManager().findFragmentByTag(HOME_FRAGMENT);

    if (savedHomeFragment == null) {
        mHomeFragment = new HomeFragment();
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            mHomeFragment.setEnterTransition(new Fade(Fade.MODE_IN));
            mHomeFragment.setExitTransition(new Slide(Gravity.START));
        }
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
        fragmentTransaction.add(R.id.placeholder, mHomeFragment, HOME_FRAGMENT);
        fragmentTransaction.commit();
    } else {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            savedHomeFragment.setEnterTransition(new Fade(Fade.MODE_IN));
            savedHomeFragment.setExitTransition(new Slide(Gravity.START));
        }
    }

void buttonClick() {
    TargetFragment targetFragment = new TargetFragment();
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        targetFragment.setEnterTransition(new Slide(Gravity.END));
    }
    FragmentManager fragmentManager = getSupportFragmentManager();
    FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
    fragmentTransaction.replace(R.id.placeholder, targetFragment , TARGET_FRAGMENT);
    fragmentTransaction.addToBackStack(null);
    fragmentTransaction.commit();
}

What am I doing wrong?

score 1 · Accepted Answer · answered Aug 17 '16 at 12:11

1

The buttons on your first fragment are placed upon a container without a background. The white background you are seeing is the background of your Activity. Provide a background color on the root element in your Fragment1 layout and your issue will be fixed.

answered Aug 17 '16 at 12:11

MrJM

1,214
1
12
26

1

Wow, just this oneliner has put an end to my weeks of research. Thank you so very much son. Everything is okay now, just that the active fragment seems to overlay above the incoming fragment. Can this be fixed? like making everything move smoothly. I mean let the incoming fragment contain the entire view just as the outgoing fragment is leaving. – Julius Lamar Aug 17 '16 at 14:38
@JuliusLamar I currently have this issue (on forward navigation, outgoing fragment is overlayed on top of incoming fragment). Did you ever find a solution for this? – sbearben Jul 22 '21 at 02:48

Problems with fragment transitions

1 Answers1