Android - imageview.setBackgroundResource issues

Question

I have an image view which i have set to 400dp(width) and 300dp(height). This image view is used in a list view where i am loading the images from url. During loading of the images, i show an progess bar like animation which is set something like this:

imageView.setBackgroundResource(R.drawable.progress);
            final AnimationDrawable startAnimation = (AnimationDrawable) imageView
                    .getBackground();

            startAnimation.start();

once the image is finished loading , i ll remove this animation and set the loaded image as shown below:

imageView.setBackgroundResource(0);
            imageView.setImageBitmap(bitmap);

But the probelm is, the animation is also taking the specified width and height, ie 400dp and 300dp respectively, how can i reduce the size of animation drawable alone ?

my animation file: progress.xml

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/anim_black"
    android:oneshot="false" >

    <item
        android:drawable="@drawable/frame_1"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_2"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_3"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_4"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_5"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_6"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_7"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_8"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_9"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_10"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_11"
        android:duration="100"/>
    <item
        android:drawable="@drawable/frame_12"
        android:duration="100"/>

</animation-list>

frame 1, frame 2 ....frame 12 are the png files which i got by splitting the gif image.

Answer 1

You should use setImageResource for animation in your case. Background image is always scaled to fit the whole image. You also need to chage a ScaleType before starting an animation and after the image is loaded as well.

imageView.setImageResource(R.drawable.progress);
imageView.setScaleType(ScaleType.CENTER);

final AnimationDrawable startAnimation = (AnimationDrawable) imageView.getDrawable();
startAnimation.start();

// and once image is loaded
imageView.setImageBitmap(bitmap);
imageView.setScaleType(ScaleType.CENTER_INSIDE);

Answer 2

Come on dude. You are doing it the longer way. Its better to use a custom Progressbar for your purpose. What you need to do is to use a frame layout of the same size of your Imageview and put a progress bar & your imageview into the same view above your imageview. Once the image is loaded change the visibility of progressbar to View.GONE or View.INVISIBLE. It can be fairly used in listviews as well without any memory issues. For implementing a custom progressbar use this.

     <ProgressBar
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:indeterminateDrawable="@anim/progress_bar_anim" >
      </ProgressBar>

Where yout drawable progress_bar_anim.xml is

 <?xml version="1.0" encoding="utf-8"?>
  <animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/pro_indi"
    android:pivotX="50%"
    android:pivotY="50%" />

pro_indi is any circular image to be rotated.

<FrameLayout>
     <ImageView>
     <Progressbar>
</FrameLayout>