Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Crossfading using TransitionDrawable not working on android

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

like image 922
Jack Sparrow Avatar asked Jul 05 '14 23:07

Jack Sparrow


4 Answers

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.

like image 172
Simas Avatar answered Sep 18 '22 12:09

Simas


You should use setCrossFadeEnabled propery

final TransitionDrawable briefcaseTransition = (TransitionDrawable) briefcase.getDrawable(); briefcaseTransition.setCrossFadeEnabled(true); briefcaseTransition.startTransition(500); 
like image 41
cesards Avatar answered Sep 19 '22 12:09

cesards


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

like image 33
azuztekztorem Avatar answered Sep 18 '22 12:09

azuztekztorem


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

like image 28
aaronvargas Avatar answered Sep 22 '22 12:09

aaronvargas