Android Animation in ImageView is stretched vertically

Issue

Everything looks perfect when I use the ImageView to show a png image like this:

<ImageView 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:id="@+id/png_picture"
     android:src="@drawable/paos_connection"/>

The image is scaled perfectly, fills the screen horizontally and has the correct aspect ratio.

Now, I want to replace the image with an animation. I decided on using Frame Animation as shown here: http://developer.android.com/guide/topics/graphics/view-animation.html. I am using the same size png files (slightly modified copies of the original one).

My problem is that the animation is playing and it is filling up the screen horizontally as before, but it is now stretched vertically. I can force it to have the correct height by hard-coding a height:

<ImageView 
     android:layout_width="fill_parent" 
     android:layout_height="210px" 
     android:id="@+id/animation" />

...but obviously this is not a good solution because the image should have the correct aspect ratio on all screen sizes.

Solution

This may help. I've found without a lot of footwork, you're stuck using a fixed element unless the image is drawn in order with the rest of the layout on initialization.

http://developer.android.com/reference/android/widget/ImageView.ScaleType.html

A quick hack to try would be to set a transparent image in its place with the same dimensions as the animated image. Programatically create an ImageView using the width & height of the rendered transparent image. Following that, animate the the instantiated image.

Answered By - Ryan