Remove the white screen a Slide window transition creates when it starts

Question

I am using an activity with a black background. That same activity has a toolbar and a DrawerLayout as well. This white screen makes the look inconsistent.

It can be

Answer 1

Seems like the old activity will not "stay" in view when you have a custom transition. I don't know when that started, but you definitely didn't need a stay animation in some previous API levels. The old 2.0 era overridePendingTransition still works fine:

anim/slide_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="100%"
        android:toXDelta="0%"
        android:duration="600"
        />
</set>

anim/slide_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0%"
        android:toXDelta="100%"
        android:duration="600"
        />
</set>

anim/stay.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:duration="600"/>
</set>

Main activity's startActivity:

startActivity(intent);
overridePendingTransition(
        R.anim.slide_in,
        R.anim.stay
);

Second activity's return:

@Override
public void onBackPressed() {
    super.onBackPressed();

    overridePendingTransition(
            0,
            R.anim.slide_out
    );
}

Answer 2

This is a little late, but I encountered the same thing myself, and found no answer for it in the internet.

The reason for the gap between the screens is that you call both an exit transition and an enter transition.

The exit transition happens as soon as you call startActivity, and the enter transition happens later, after the onCreate of the new activity.

Therefore, the order of events will be:

1. Activity A exits
2. Wait for activity B to finish loading
3. Activity B enters

For me the solution was to simply remove the exit transition. The outcome looks pretty much the same, and the lack of the exit transition is barely noticeable as a new activity slides over it.

After removing the exit transition, the time when there was a "white screen" is not seen because in that time Activity A is still present.

Answer 3

How to fix the white screen during the slide in transition for the started activity:

karaokyos answer utilizes the pre Lollipop activity transitions. These transitions target the whole activity screen and don't provide capabilities to exclude parts of the screen during the transition.

John Ernest Guadalupe approach utilizes the transitions introduced in Lollipop (Activity & Fragment Transitions). The observed "white screen" is the window background, that is fading in during the transition (more info about Activity & Fragment Transitions ). I guess you are setting the "black background" of your activities in the root view of your layout? Setting the window background to black should solve your problem.

Programmatically:

window.setBackgroundDrawable(new ColorDrawable(Color.BLACK));

Theme:

<item name="android:windowBackground">@android:color/black</item>

This is the resulting transition.

Edit: How to provide the required slide out (left) transition for the calling activity

First Activity:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    Window window = getWindow();
    Slide slide = new Slide();
    slide.setInterpolator(new LinearInterpolator());
    slide.setSlideEdge(Gravity.LEFT);
    slide.excludeTarget(android.R.id.statusBarBackground, true);
    slide.excludeTarget(android.R.id.navigationBarBackground, true);
    window.setExitTransition(slide); // The Transition to use to move Views out of the scene when calling a new Activity.
    window.setReenterTransition(slide); // The Transition to use to move Views into the scene when reentering from a previously-started Activity.
    window.setBackgroundDrawable(new ColorDrawable(Color.BLACK));
}

Second Activity:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    Window window = getWindow();
    Slide slide = new Slide();
    slide.setInterpolator(new LinearInterpolator());
    slide.setSlideEdge(Gravity.RIGHT);
    slide.excludeTarget(android.R.id.statusBarBackground, true);
    slide.excludeTarget(android.R.id.navigationBarBackground, true);
    window.setEnterTransition(slide); // The Transition to use to move Views into the initial Scene.
    window.setReturnTransition(slide); // The Transition to use to move Views out of the Scene when the Window is preparing to close.
    window.setBackgroundDrawable(new ColorDrawable(Color.BLACK));
}

You can try different interpolators to change the pace of the transition.

Resulting transition with LinearInterpolator:

If you want to get rid of the gap between the slide out of the first and slide in of the second activity you can set:

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

How to debug transitions:

It can become a lot more apparent when you set a very slow duration to the Slide transition when opening an activity.

To (visually) debug transitions there are 3 options ("Window animation scale","Transition animation scale", "Animation duration scale") in the development settings to multiply the duration of all transitions/animations.

Answer 4

I also had this problem but with fragment transitions and since all the solutions that came up were just setting the window background which probably works with activities I wasn't really getting anywhere. Than I thought => let's just try to set the background of rootview in the fragment I'm pushing in to transparent.. And voila, this did the trick. So the rootview of the fragment that I'm pushing looks like this in xml:

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