How to get rid of weird artifacts in fragment transition on top of camera preview

Question

I have an app which opens a screen filling DialogFragment on top of a camera preview:

FragmentTransaction ft = fm.beginTransaction();
ft.setCustomAnimations(R.anim.slide_in_up, 0, 0, R.anim.slide_out_down);
ft.add(R.id.fragment_container, fragment);

So far so good. But when I click the back button and the fragment gets popped from backstack the black dialog background gets some margin at the bottom (while the animation is playing). My guess is that its a Android 5 problem since I can only reproduce it on my Galaxy S5 (Lollipop).

Any ideas why this is happening?

Dialog view xml:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:layout_height="match_parent"
            android:layout_width="match_parent"
            android:background="@color/dialog_background">


<com.receiptpalapp.android.widget.ViewPagerIndicator
    android:id="@+id/camera_instructions_vpi"
    android:layout_width="wrap_content"
    android:layout_height="@dimen/paginator_circle_diam"
    android:layout_centerHorizontal="true"
    app:activeDrawable="@drawable/view_pager_active_indicator"
    app:inactiveDrawable="@drawable/view_pager_inactive_indicator"
    app:circleMargin="@dimen/gap_mid"
    android:layout_marginBottom="@dimen/gap_normal"
    android:layout_alignParentBottom="true"/>

<android.support.v4.view.ViewPager
    android:id="@+id/camera_instructions_vp"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

</android.support.v4.view.ViewPager> </RelativeLayout>

Answer 1

After hours of debugging I found the answer: Animations on top of camera preview (=SurfaceView) won't work properly across devices unless you set the background color of your surface view.

See also here: ugly fragment transition to surfaceview with overlay