Animation for Expandablelistview

Animation for expandableListView

It can be done using a simple ListView that contains an initially hidden view and a custom class that extends Animation.
The basic idea is to start with View.GONE then gradually re-size the margin from a negative value to the required size while setting visibility to View.VISIBLE.

See:

• https://github.com/tjerkw/Android-SlideExpandableListView
• Android Animation: Hide/Show Menu
• How do I animate View.setVisibility(GONE)

..and finally

• Cool toolbar for ListView items + source

The last example contains all the code you need. It looks a bit hackish to me, especially the fact that you must initially set view.bottomMargin = -50 or more, otherwise the animation does not work properly the first time, but so far I did not find any viable alternative (apart from using a ScrollView with your own container items instead of a ListView).

And finally, this app includes the above example, among lots of other useful examples with links to sources:

• https://market.android.com/details?id=com.groidify.uipatterns

Update: Google removed the app from play store allegedly for intellectual property violation (although it only contained demos and links to open source projects), the author now made the apk available for direct download from http://goo.gl/ihcgs
For more details see https://plus.google.com/108176685096570584154/posts. NB: I'm not affiliated with the author.

Expand ListView item with animation

I think I was looking for the same as was asked, I was looking for a way to animate the expanding of the listview item as some new content is shown (I was just changing the visibility on some views from GONE to VISIBLE). I had used the answer by mirroredAbstraction to help me apply a translate animation (I didn't want a rotate animation):

<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fromYDelta="0"
android:toYDelta="-100%p"
android:duration="500"   
/>

to each of the views. It create a nice effect, but looking closely, the listview item was actually suddenly expanding to the entire size that would be needed, then the animation dropped the views into place. But what I wanted was the effect of the listview item growing down as the views come into visibility.

I found exactly what I was looking for here:
expanding-listview-items

The blogger has a link to his github sample, here:
ExpandAnimationExample

If you find these sites gone, please inform me and I will make my copy available.

he put a negative margin on the content to come into visibility as well as setting visibility to GONE:

android:layout_marginBottom="-50dip"

and wrote an animation manipulating the bottom margin:

public class ExpandAnimation extends Animation {
...
    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        super.applyTransformation(interpolatedTime, t);

        if (interpolatedTime < 1.0f) {

            // Calculating the new bottom margin, and setting it
            mViewLayoutParams.bottomMargin = mMarginStart
                    + (int) ((mMarginEnd - mMarginStart) * interpolatedTime);

            // Invalidating the layout, making us seeing the changes we made
            mAnimatedView.requestLayout();
        }
        ...
    }
}

and it looks very nice. I found his answer to this SO (possible duplicate?) question:

Adding animation to a ListView in order to expand/collapse content

Also, please let me know if you know another way to do the same thing.

Related Topics