Transition animation between activities creates a white tail artifact

Question

I use the following code to show new activity with the custom animation. The new activity appears from the bottom of the screen and goes to the top, and the old activity fades in.

startActivity(intent);
overridePendingTransition(R.anim.slide_in_up, R.anim.fade_in);

slide_in_up.xml:

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">  
    <translate android:fromYDelta="100%" 
        android:toYDelta="0%"  
        android:duration="@android:integer/config_shortAnimTime"/>  
</set>  

fade_in.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">  
  <alpha android:fromAlpha="1.0" 
      android:toAlpha="0.5"  
      android:duration="@android:integer/config_mediumAnimTime" />  
</set>  

The problem is that when the activity appears and goes up, on top of it while it's moving there is the white stripe artifact or tail which then quickly disappears.

I'm developing for SDK 8. The strange thing is that if I run my app on Android 4.1.2 there is no artifact during the transition but for all previous versions there is.

The animation in opposite direction works

When I set the opposite direction slide_in_up.xml:

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android" >  
    <translate 
        android:fromYDelta="-100%" 
        android:toYDelta="0%"  
        android:duration="@android:integer/config_shortAnimTime"/>  
</set>  

The transition works very well.

The activity I launch has the following layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/black"
        android:gravity="fill_vertical" >
        <Button
            android:id="@+id/goHomeButton"
            style="@style/HeaderTextStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:text="@string/comparison_title" />
    </RelativeLayout>
    <ListView
        android:id="@+id/listViewComparison"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/gray"
        android:cacheColorHint="@color/transp"
        android:divider="@null"
        android:listSelector="@color/transp" >
    </ListView>
</LinearLayout>

Answer 1

You may want to try adding this to your activity/app's theme:

<item name="android:windowIsTranslucent">true</item>