Card flip animation lagging/stuttering with MapView

Issue

I'm doing the card flip animation with a ListFragment and another fragment which has a MapView. The problem is that the animation is very choppy which I believe is because the MapView starts rendering the map during the animation.

Is there any workaround (such as preloading the map before I start the animation)?

Solution

I solved this by adding both the fragments to the activity at the same time and hiding the second fragment initially rather than creating and adding it just before the animation starts.

For the animation, I just showed the second fragment and hid the first one. Same goes for the reverse flip.

For the first flip

final Fragment fragment = new BackSideFragment();
fragment.setTargetFragment(FrontSideFragment.this, 0);

final FragmentManager fm = getFragmentManager();
FragmentTransaction ft = fm.beginTransaction();
ft.add(R.id.content, fragment);
ft.hide(fragment);
ft.commit();

toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {

    @Override
    public boolean onMenuItemClick(MenuItem menuItem) {
        FragmentTransaction ft = fm.beginTransaction();
        ft.setCustomAnimations(R.animator.card_flip_right_in, R.animator.card_flip_right_out);
        ft.show(fragment);
        ft.hide(FrontSideFragment.this);
        ft.commit();
        return true;
    }
});

And for the reverse flip

FragmentTransaction ft = getFragmentManager().beginTransaction();
ft.setCustomAnimations(R.animator.card_flip_left_in, R.animator.card_flip_left_out);
ft.hide(BackSideFragment.this);
ft.show(getTargetFragment());
ft.commit();

Answered By - timemanx