选定列表视图项的向上滑动动画

Slide up animation for selected listview items

我有一个列表视图。我想添加一个动画,如果我 select 一个列表项,那么它将被删除,并且该项目下方的其余项目将通过向上滑动动画向上移动。我已经通过获取其子位置使用线性布局完成了此操作,但我无法理解如何向上滑动列表视图的其余元素。请帮忙

下面是我在动态创建的线性布局中的动画代码

    plus.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {


            Animation animation1 = AnimationUtils.loadAnimation(getActivity(), R.anim.move);
            final Animation animation2 = AnimationUtils.loadAnimation(getActivity(), R.anim.moveup);

这是我们点击的那个项目的动画

            lay1.startAnimation(animation1);

这是动画rest child向上滑动的代码

            final int i = lay1.getId() + 1;


            final Handler handler = new Handler();
            handler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    //Do something after 100ms

                    try {
                        LinearLayout l = (LinearLayout)                       layoutall.getChildAt(i);
                        l.startAnimation(animation2);
                        layoutall.removeView(lay1);
                    } catch (Exception e) {

                        //connectToDatabase();
                    }
                }
            }, 600);

更新代码 非常感谢。我能够实现此功能,但问题是我在一个列表视图中使用了两个动​​画,但无法实现第一个动画。

我想在点击时向左滑动的列表项代码

       viewHolder.accept.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                removeListItem(viewHolder.order_card_layout, position);

            }
        });

动画代码为

      protected void removeListItem(final View rowView, final int positon) {
    // TODO Auto-generated method stub


    final Animation animation = AnimationUtils.loadAnimation(rowView.getContext(), R.anim.move);
    rowView.startAnimation(animation);

    Animation.AnimationListener al = new Animation.AnimationListener() {
        @Override
        public void onAnimationEnd(Animation arg0) {

            ViewHolder vh = (ViewHolder) rowView.getTag();
            //vh.needInflate = true;

        }
        @Override public void onAnimationRepeat(Animation animation) {}
        @Override public void onAnimationStart(Animation animation) {}
    };


    collapse(rowView, al);

}

但问题是我的第一个动画向右滑动不工作

    final Animation animation = AnimationUtils.loadAnimation(rowView.getContext(), R.anim.move);
    rowView.startAnimation(animation);

新更新代码 我能够实现此功能,但问题是我使用了两个动​​画,并想对我单击的那个项目做第一个动画,然后对下面所有单击的列表项目做另一个动画 item.But 我的问题是该项目我在其上单击向右滑动,它也重新出现并与整个列表一起向上滑动,但我希望我单击的项目向右滑动,其余的项目向上滑动。

我想在点击时向左滑动的列表项代码

       viewHolder.accept.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                removeListItem(viewHolder.order_card_layout, position);

            }
        });

动画代码为

protected void removeListItem(final View rowView, final int positon) { // TODO 自动生成的方法存根

    final Animation animation = AnimationUtils.loadAnimation(rowView.getContext(), R.anim.move);
    rowView.startAnimation(animation);


    final Handler handler = new Handler();
    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            //Do something after 100ms

            try {


                Animation.AnimationListener al = new Animation.AnimationListener() {
                    @Override
                    public void onAnimationEnd(Animation arg0) {

                        ViewHolder vh = (ViewHolder) rowView.getTag();
                        //vh.needInflate = true;

                    }

                    @Override
                    public void onAnimationRepeat(Animation animation) {
                    }

                    @Override
                    public void onAnimationStart(Animation animation) {
                    }
                };


                collapse(rowView, al);


            } catch (Exception e) {

                //connectToDatabase();
            }
        }
    }, 600);





}






            private void collapse(final View v, Animation.AnimationListener al) {
    final int initialHeight = v.getMeasuredHeight();

    Animation anim = new Animation() {
        @Override
        protected void applyTransformation(float interpolatedTime, Transformation t) {
            if (interpolatedTime == 1) {
                v.setVisibility(View.GONE);
            }
            else {
                v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
                v.requestLayout();
            }
        }

        @Override
        public boolean willChangeBounds() {
            return true;
        }
    };

    if (al!=null) {
        anim.setAnimationListener(al);
    }
    anim.setDuration(600);
    v.startAnimation(anim);
}

这是与您的要求相关的代码,试试这个

https://github.com/paraches/ListViewCellDeleteAnimation

下载代码并运行它。

如果你想看演示而不是看这个视频,

http://www.youtube.com/watch?v=bOl5MIti7n0

这是代码,我在其中实现了两个动画。

1) 点击列表-查看项目-点击的同时向右滑动

2) 单击删除按钮时,列表视图中剩余行的向上滑动动画(我已经在 link 中完成了)。

将以下文件复制到您的动画文件夹。

1) fade_out.xml :

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <alpha
        android:duration="700"
        android:fromAlpha="1"
        android:toAlpha="0" />
</set>

2) fade_in.xml :

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <alpha
        android:duration="700"
        android:fromAlpha="0"
        android:toAlpha="1" />
</set>

3) slide_in_right.xml :

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <translate
        android:duration="700"
        android:fromXDelta="100%"
        android:toXDelta="0%" />
</set>

4) slide_out_right.xml :

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <translate
        android:duration="700"
        android:fromXDelta="0%"
        android:toXDelta="100%" />
</set>

现在将以下方法和 class 添加到您的 activity,

//Animation
    private void fadeOutView(View view) {
        Animation fadeOut = AnimationUtils.loadAnimation(view.getContext(), R.anim.fade_out);
        if (fadeOut != null) {
            fadeOut.setAnimationListener(new ViewAnimationListener(view) {
                @Override
                protected void onAnimationStart(View view, Animation animation) {

                }

                @Override
                protected void onAnimationEnd(View view, Animation animation) {
                    view.setVisibility(View.GONE);
                }
            });
            view.startAnimation(fadeOut);
        }
    }

    private void fadeInView(View view) {
        Animation fadeIn = AnimationUtils.loadAnimation(view.getContext(), R.anim.fade_in);
        if (fadeIn != null) {
            fadeIn.setAnimationListener(new ViewAnimationListener(view) {
                @Override
                protected void onAnimationStart(View view, Animation animation) {
                    view.setVisibility(View.VISIBLE);
                }

                @Override
                protected void onAnimationEnd(View view, Animation animation) {

                }
            });
            view.startAnimation(fadeIn);
        }
    }

    private void slideInView(View view) {
        Animation slideIn = AnimationUtils.loadAnimation(view.getContext(), R.anim.slide_in_right);
        if (slideIn != null) {
            slideIn.setAnimationListener(new ViewAnimationListener(view) {
                @Override
                protected void onAnimationStart(View view, Animation animation) {
                    view.setVisibility(View.VISIBLE);
                }

                @Override
                protected void onAnimationEnd(View view, Animation animation) {

                }
            });
            view.startAnimation(slideIn);
        }
    }

    private void slideOutView(View view) {
        Animation slideOut = AnimationUtils.loadAnimation(view.getContext(), R.anim.slide_out_right);
        if (slideOut != null) {
            slideOut.setAnimationListener(new ViewAnimationListener(view) {
                @Override
                protected void onAnimationStart(View view, Animation animation) {

                }

                @Override
                protected void onAnimationEnd(View view, Animation animation) {
                    view.setVisibility(View.GONE);
                }
            });
            view.startAnimation(slideOut);
        }
    }

    private abstract class ViewAnimationListener implements Animation.AnimationListener {

        private final View view;

        protected ViewAnimationListener(View view) {
            this.view = view;
        }

        @Override
        public void onAnimationStart(Animation animation) {
            onAnimationStart(this.view, animation);
        }

        @Override
        public void onAnimationEnd(Animation animation) {
            onAnimationEnd(this.view, animation);
        }

        @Override
        public void onAnimationRepeat(Animation animation) {

        }

        protected abstract void onAnimationStart(View view, Animation animation);

        protected abstract void onAnimationEnd(View view, Animation animation);
    }

现在,如果您想在 List Item Click 上显示动画,请在 Adapter class 中提供动画,其中您已为 listView 充气 raw_layout。

5) raw_layout.xml :

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:id="@+id/linLayout">

    <ImageButton
        android:id="@+id/cell_trash_button"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:src="@drawable/trash_can"
        android:scaleType="fitXY" />

    <TextView
        android:id="@+id/cell_name_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|left"
        android:layout_marginLeft="16dp"
        android:layout_weight="1"
        android:text="cell name" />

</LinearLayout>

6) 最后在父级 Layout.Here 适配器 onClick 的 getView() 方法中将动画应用到 raw_layout 的父级布局 我的 raw_layout 父级布局是 LinearLayout,其 ID 名为linLayout.

vh.linLayout.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    if (vh.linLayout.getVisibility() == View.VISIBLE) {
                        fadeOutView(vh.linLayout);
                        slideInView(vh.linLayout);
                    } else {
                        fadeInView(vh.linLayout);
                        slideOutView(vh.linLayout);
                    }
                }
            });

我已经尝试过这个并且它有效。所以试试这个!!