animationDrawable only displays last frame

Question

I'm trying to create an animation out of multiple png images. Here's my code:

AnimationDrawable animation = new AnimationDrawable();

for (int i = 0; i < translate_text.length(); i++)
{
    byte[] byteArray = Base64.getDecoder().decode(client._fromServer.elementAt(i));
    Bitmap bmp = BitmapFactory.decodeByteArray(byteArray, 0, byteArray.length);
    ImageView image = (ImageView) findViewById(R.id.sign);
    image.setImageBitmap(Bitmap.createScaledBitmap(bmp, image.getWidth(), image.getHeight(), false));
    animation.addFrame(image.getDrawable(), 1000);
}

animation.setOneShot(true);
animation.start();

but this only displays the last frame... Any ideas?

Edit: Probably should've done this earlier, but here goes:

translate_text is a string. It represents the image sequence. For example if the string is "bob" then there should be 3 images: the letter B, the letter O and the letter B.

client._fromServer is a vector of strings. Each string is the image itself encoded in base64. That's why client._fromServer.elementsAt(i) is a string that needs to be decoded and turned into byteArray.

When you debug your code, what is the value of `translate_text`? Are you sure you get a different image on each loop iteration? What is this `client._fromServer.elementAt(i)` (it is really weird)? — grandouassou, Mar 02 '19 at 10:59
translate_text is a string, in which each character represents an image (for example if the string is "bob" then I will have 3 images: the letter B, the letter O and the letter B). client._fromServer.elementAt(i) is a string representation of the image (which is encoded in base64). and yea I'm really sure it gets a different image on each loop iteration @florian — Bines, Mar 02 '19 at 11:07

grandouassou · Accepted Answer · 2019-03-02T11:33:50.513

0

I think it is because you get the Drawable from the same ImageView.
When you do image.setImageBitmap() it updates the reference of the Drawable in the ImageView and the AnimationDrawable gets affected also.
You should use a different Drawable instance for each addFrame call.

Something like that:

AnimationDrawable animation = new AnimationDrawable();
ImageView image = (ImageView) findViewById(R.id.sign);

for (int i = 0; i < translate_text.length(); i++)
{
    byte[] byteArray = Base64.getDecoder().decode(client._fromServer.elementAt(i));
    Bitmap bmp = BitmapFactory.decodeByteArray(byteArray, 0, byteArray.length);
    final Bitmap scaledBitmap = Bitmap.createScaledBitmap(bmp, image.getWidth(), image.getHeight(), false);
    Drawable drawable = new BitmapDrawable(getResources(), scaledBitmap);
    animation.addFrame(drawable, 1000);
}

animation.setOneShot(true);
animation.start();

edited Mar 02 '19 at 11:33

answered Mar 02 '19 at 11:23

grandouassou

2,500
3
25
60

I edited my answer so it is clearer. In the screenshot you posted you're still using the same instance of the image and thus the drawable. If it is still not clear why this happens, feel free to ask for more details. – grandouassou Mar 02 '19 at 11:38
Oh I think I understand, thanks! I tried your code and I think it works but it doesn't display on the screen, is it supposed to be placed where the original ImageView is? or am I supposed to do something to set its coordinates or something? – Bines Mar 02 '19 at 12:18
After the for-loop, `image.setImageDrawable(animation);`. – grandouassou Mar 02 '19 at 13:03

animationDrawable only displays last frame

1 Answers1