Animate each item of Listview when displaying

Question

I am trying to show listview elments in a manner that each one of them animates and then become visible so after one by one they animate and get visible to user. but When I implemented the animation, its not working on individial item, but working on the whole listview :(

public View getView(final int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub

        LayoutInflater layoutInflater = (LayoutInflater) activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View row =layoutInflater.inflate(R.layout.categories_row, parent, false);




        tvCatName = (TextView) row.findViewById(R.id.tvCatName);

        tvCatName.setText(Data.alCategoriesModels.get(position).catname);


        row.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View arg0) {
                // TODO Auto-generated method stub

                Toasts.pop(activity, "Category id :  " + Data.alCategoriesModels.get(position).catID); 

            }
        });

//      row.setAnimation(animation);
        row.startAnimation(animation);

        return row;
    }

How to make one by one animation on each element of list view. I am extend ArrayAdapter.

Hyson

Answer 1

You can apply a android:layoutAnimation on the ListView.

• Create your animation XML file in anim folder. For example (slide_right_in.xml):

  <translate xmlns:android="http://schemas.android.com/apk/res/android"
      android:fillAfter="true"
      android:duration="400"
      android:fromXDelta="-100%"
      android:toXDelta="0%"/>
  

• Create another animation XML file with root element layoutAnimation :(my_layout_animation.xml)

  <layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
      android:animation="@anim/slide_right_in"
      android:delay="0.5"/>
  

• Apply it on any ViewGroup you want. For example ListView:

  <ListView
      android:layoutAnimation = "@anim/my_layout_animation"
      ... />
  

Ammonium

this causes the app to crash – Pupa

@Pupa Let me know type of crash which you got (stacktrace) – Ammonium

Just tried this code and then then i've taken it out again. So can't provide you details. As soon as i opened the Activity with the listView, the app crashed – Pupa

@Pupa I've used this code in my apps many times and works fine. You can refer to docs about layout animation or post your stack trace – Ammonium

so simple it's brilliant – Diecious

thanks for this. But, this only work for the newly created item, not the others. any workout? – Khachaturian

how do you restart the animation when the list is repopulated? – Temblor

make sure to set my_layout_animation to RecyclerView, at first I settle slide_right_in and that has caused the app crash. Outstanding animation for a RecyclerView btw. – Psychogenesis

Answer 2

int delay=(position-list.getFirstVisiblePosition)*200;
if(delay<=200)
    delay=200;
animation.setStartOffset(delay);

Limemann

can you add some explanation? – Oak

Answer 3

After messing with my own Animation implementation which kind of worked half of the times, I've found the ListViewAnimations#ExpandableListItemAdapter which was exactly what I needed.

Here is their API demo app on Google Play: ListViewAnimations

Catina

Answer 4

here is a tutorial to Android ListView animation

EDIT :
the idea is creating a listener and animate view inside it:

lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
  @Override
  public void onItemClick(AdapterView<?> adapterView,final View view, final int position,
      long id) {
           anim.setAnimationListener(new Animation.AnimationListener() {

               @Override
              public void onAnimationStart(Animation animation) {
              }

              @Override
              public void onAnimationRepeat(Animation animation) {}

              @Override 
              public void onAnimationEnd(Animation animation) {
                    ItemDetail item = aAdpt.getItem(position);
                    aAdpt.remove(item);
              }
          });
      view.startAnimation(anim);
  }
});

Doubtful