CODEWITHSUNDEEP
androidmaterial-designshared-element-transition
Leguman
Leguman

Reputation: 2114

Blinking screen on image transition between activities

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

Upvotes: 65

Views: 35905

Answers (13)

md hasibul hasan
md hasibul hasan

Reputation: 59

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

Upvotes: 0

SumOn
SumOn

Reputation: 336

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

Upvotes: 3

Rohan majhi
Rohan majhi

Reputation: 131

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

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

Upvotes: 3

Eldhopj
Eldhopj

Reputation: 3599

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

Upvotes: 1

Randeep
Randeep

Reputation: 403

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);

Upvotes: 2

Kasium
Kasium

Reputation: 996

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>

Upvotes: 3

JDenais
JDenais

Reputation: 3016

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.

Upvotes: 1

gatti
gatti

Reputation: 1132

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());

Upvotes: 0

Rzodkiewka
Rzodkiewka

Reputation: 410

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/

Upvotes: 9

Kevin Lee
Kevin Lee

Reputation: 2347

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.

Upvotes: 47

Webdma
Webdma

Reputation: 714

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>

Upvotes: 24

Neanderthal
Neanderthal

Reputation: 947

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.

Upvotes: 2

Alex Lockwood
Alex Lockwood

Reputation: 83301

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.

Upvotes: 19

Related Questions