How to display an ImageView progressively down from top to bottom

ibiza picture ibiza · Aug 26, 2012 · Viewed 8.4k times · Source

is there a way to display an ImageView progressively from top to down, like this:

enter image description here

Sorry for the crappy animation.

Answer

user picture user · Aug 26, 2012

I'm not very familiar with android animations, but one(a little hackish) way is to wrap the image in a ClipDrawable and animate its level value. For example:

<ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/clip_source" />

Where clip_source is a drawable:

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:clipOrientation="vertical"
    android:drawable="@drawable/your_own_drawable"
    android:gravity="bottom" />

Then in code you would have:

// a field in your class
private int mLevel = 0;

ImageView img = (ImageView) findViewById(R.id.imageView1);
mImageDrawable = (ClipDrawable) img.getDrawable();
mImageDrawable.setLevel(0);
mHandler.post(animateImage);

The animateImage is a Runnable object:

private Runnable animateImage = new Runnable() {

        @Override
        public void run() {
            doTheAnimation();
        }
    };

and the doTheAnimation method:

private void doTheAnimation() {
    mLevel += 1000;
    mImageDrawable.setLevel(mLevel);
    if (mLevel <= 10000) {
        mHandler.postDelayed(animateImage, 50);
    } else {
        mHandler.removeCallbacks(animateImage);
    }
}