Crossfading using TransitionDrawable not working on android

Question

I have two Images that I want to cross fade. Initially they both use imageview. I then use .getDrawable() to get the drawable of the images.

This is the code I used

Drawable backgrounds[] = new Drawable[2];
backgrounds[0] = BackgroundImage.getDrawable();
backgrounds[1] = BackgroundImageBlurred.getDrawable();

TransitionDrawable crossfader = new TransitionDrawable(backgrounds);
crossfader.startTransition(3000);

It only shows the image on the first array element, which it shows anyway since both images were set to visible in the XML.

The transition doesn't start

Any help would be appreciated :)

score 39 · Accepted Answer · answered Jul 06 '14 at 00:12

Here's an example IF you have 2 drawables and want to animate their transition in some ImageView:

package com.example.app;

import android.app.Activity;
import android.content.res.Resources;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.TransitionDrawable;
import android.os.Bundle;
import android.widget.ImageView;

 class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Drawable backgrounds[] = new Drawable[2];
        Resources res = getResources();
        backgrounds[0] = res.getDrawable(android.R.drawable.btn_star_big_on);
        backgrounds[1] = res.getDrawable(android.R.drawable.btn_star_big_off);

        TransitionDrawable crossfader = new TransitionDrawable(backgrounds);

        ImageView image = (ImageView)findViewById(R.id.image);
        image.setImageDrawable(crossfader);

        crossfader.startTransition(3000);

    }
}

Then if you want to transition back to the original image you can call

// Make sure the transition occurred
crossfader.startTransition(0);
// Reverse transition
crossfader.reverseTransition(3000);

Please correct me if I misunderstood your question.

It should be noted that crossfading with a semi transparent background doesn't work, this will make both drawables overlap at end. — Warpzit, Apr 06 '16 at 06:03

score 14 · Answer 2 · answered Mar 25 '15 at 14:42

14

You should use setCrossFadeEnabled propery

final TransitionDrawable briefcaseTransition = (TransitionDrawable) briefcase.getDrawable();
briefcaseTransition.setCrossFadeEnabled(true);
briefcaseTransition.startTransition(500);

answered Mar 25 '15 at 14:42

cesards

15,882
11
70
65

score 6 · Answer 3 · edited Oct 14 '15 at 02:34

Maybe you like this one
- res/drawable/transition.xml:

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/on" />
    <item android:drawable="@drawable/off" />
</transition>

ImageView:

<ImageButton android:id="@+id/button"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/transition" />

Javacode:

ImageButton button = (ImageButton) findViewById(R.id.button);
TransitionDrawable drawable = (TransitionDrawable) button.getDrawable();
drawable.startTransition(500);

If it is helpfull, you can see Google-Dev:

http://developer.android.com/guide/topics/resources/drawable-resource.html

score 6 · Answer 4 · answered Feb 07 '19 at 23:36

6

If you are using Vectors, your VectorDrawables won't be cross-faded in the TransitionDrawable.

You'll need to convert them into BitmapDrawables first.

See my answer here https://stackoverflow.com/a/54583929/114549 for an example

answered Feb 07 '19 at 23:36

aaronvargas

12,189
3
52
52

score 2 · Answer 5 · answered Jul 06 '14 at 00:13

A TransitionDrawable is just a special kind of drawable. It is not drawn by itself, it must be placed somewhere (e.g. on a View background, on an ImageView, &c) to be displayed.

If you're trying to crossfade two images, you have two possible approaches:

Use a single ImageView with a TransitionDrawable.
Use two ImageViews and crossfade them with animations.

Crossfading using TransitionDrawable not working on android

5 Answers5

Linked