Blinking screen on image transition between activities

AndroidMaterial DesignShared Element-Transition

Android Problem Overview


I implemented an image transition between two activities using the new shared elements from lollipop. It's working but I get a weird white blinking on the entire screen during the transition and I can't find how to get rid of it. Here is an example: Status bar also blinking

Here is how the second activity is launched

public static void launch(
            @NonNull Activity activity, @NonNull View transitionView, Game game) {
        ActivityOptionsCompat options =
                ActivityOptionsCompat.makeSceneTransitionAnimation(
                        activity, transitionView, game.gameFullId);
        Intent intent = new Intent(activity, ListImportationLoginActivity.class);
        intent.putExtra(INTENT_EXTRA_GAME, retailer);
        ActivityCompat.startActivity(activity, intent, options.toBundle());
    }

Then in onCreate:

ViewCompat.setTransitionName(mLogoView, mGame.gameFullId);  

And the theme file:

<resources>
    <style name="Theme.MyApp.NoActionBar" parent="Theme.MyApp.NoActionBar.Base">
        <item name="android:windowContentTransitions">true</item>
        <item name="android:windowAllowEnterTransitionOverlap">true</item>
        <item name="android:windowAllowReturnTransitionOverlap">true</item>
        <item name="android:windowSharedElementEnterTransition">@android:transition/move</item>
        <item name="android:windowSharedElementExitTransition">@android:transition/move</item>
    </style>
</resources>  

Thanks for your help

Android Solutions


Solution 1 - Android

On the exiting activity, call getWindow().setExitTransition(null);

On the entering activity, call getWindow().setEnterTransition(null);

It will prevent the fade out of the exiting activity and the fade in of the entering activity, which removes the apparent blinking effect.

Solution 2 - Android

I solved this issue by changing background color of my default theme, hope this is still can help to someone save the time.

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

Solution 3 - Android

The "white blinking" you are seeing is the result of the two activities alpha-animating in and out during the transition: when activity A starts activity B, activity A fades out and activity B fades in.

If you want to prevent the status bar and/or navigation bar from fading during the transition (and thus reducing the "blinking" effect a bit), you can look at this post.

Solution 4 - Android

Make some method in helper like

public static Transition makeEnterTransition() {
    Transition fade = new Fade();
    fade.excludeTarget(android.R.id.navigationBarBackground, true);
    fade.excludeTarget(android.R.id.statusBarBackground, true);
    return fade;
}

Execute it in the activity that you are starting like this

getWindow().setEnterTransition(TransitionUtils.makeEnterTransition());

Source https://github.com/alexjlockwood/custom-lollipop-transitions/

Solution 5 - Android

I have had similar blinking issues and tried many of the examples mentioned here but for me it didn't solve the issues. What did work for me was changing the window background for the second activity theme to transparent. (@Webdma used black, but in my case that made the screen flash black instead of white)

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

Solution 6 - Android

<!-- edit in your theme -->
<item name="android:windowEnterTransition">@android:transition/no_transition</item>
<item name="android:windowExitTransition">@android:transition/no_transition</item>

Solution 7 - Android

I had a similar problem. I solved the blinking status bar and navigation bar issues by excluding them from the transition as per @Alex's suggestion, but the screen was still blinking when switching between the activities. When I removed the "finish();" statement after startActivity(); the screen stopped blinking. May it was due to the closing of calling activity. Hope this helps someone.

Solution 8 - Android

Some useful answers above. As far as I understand this is caused by activity transition overlap. To overcome this issue I have used the following values in the onCreate() methods of both activities:

getWindow().setAllowEnterTransitionOverlap(false);
getWindow().setAllowReturnTransitionOverlap(false);

Solution 9 - Android

Add this in your style.xml. This prevents the screen from Blinking

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

Solution 10 - Android

In my situation, the second activity did not have a status bar which was defined in the activity theme with this tag.

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

Since it was not mandatory to hide the status bar in portrait mode, I removed this tag and manually hide/show the status bar when needed and the blinking is gone.

Solution 11 - Android

Add these codes inside onCreate of both Activities where you doing Transition elements

   Fade fade = new Fade();
        View decor = getWindow().getDecorView();
        fade.excludeTarget(decor.findViewById(R.id.action_bar_container),true);
        fade.excludeTarget(android.R.id.statusBarBackground,true);
        fade.excludeTarget(android.R.id.navigationBarBackground,true);

        getWindow().setEnterTransition(fade);
        getWindow().setExitTransition(fade);

This will exclude the animation from the navigation and status bar, So no more blinking

Solution 12 - Android

Elements fade in and out, unless you specify explicitly they are the same on both activities. That includes status and navigation bar.

In your particular case, I would add the toolbar and these two views to the shared elements list:

List<Pair> viewPairs = new ArrayList<>();
viewPairs.add(Pair.create(findViewById(android.R.id.statusBarBackground), Window.STATUS_BAR_BACKGROUND_TRANSITION_NAME));
viewPairs.add(Pair.create(findViewById(android.R.id.navigationBarBackground), Window.NAVIGATION_BAR_BACKGROUND_TRANSITION_NAME));
// Add your views...

Pair[] array = new Pair[viewPairs.size()];
ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(), viewPairs.toArray(array)).toBundle();
// ...

ActivityCompat.startActivity(activity, intent, options.toBundle());

Solution 13 - Android

In Java, add the below line in the parent activity after ActivityCompat.startActivity(activity, intent, options.toBundle());

getWindow().setExitTransition(null);

and add the below line in onCreate method of child activity

getWindow().setEnterTransition(null); 

In Kotlin, add the below line in the parent activity

window.setExitTransition = null 

and add the below line in onCreate method of child activity

window.setEnterTransition = null

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionLegumanView Question on Stackoverflow
Solution 1 - AndroidKevin LeeView Answer on Stackoverflow
Solution 2 - AndroidWebdmaView Answer on Stackoverflow
Solution 3 - AndroidAlex LockwoodView Answer on Stackoverflow
Solution 4 - AndroidRzodkiewkaView Answer on Stackoverflow
Solution 5 - AndroidKasiumView Answer on Stackoverflow
Solution 6 - AndroidSumOnView Answer on Stackoverflow
Solution 7 - AndroidNeanderthalView Answer on Stackoverflow
Solution 8 - AndroidRandeepView Answer on Stackoverflow
Solution 9 - AndroidRohan majhiView Answer on Stackoverflow
Solution 10 - AndroidJDenaisView Answer on Stackoverflow
Solution 11 - AndroidEldhopjView Answer on Stackoverflow
Solution 12 - AndroidgattiView Answer on Stackoverflow
Solution 13 - Androidmd hasibul hasanView Answer on Stackoverflow