如何实现自定义列表视图文本动画

时间:2015-01-17 18:42:41

标签: android android-animation android-custom-view

我在android中创建购物应用程序。在我的应用程序中,我显示自定义列表视图中的项目列表。

如果客户选择项目,则选定项目文本将从列表视图移动到购物车图像。如下图所示,

这种类型的动画是我的要求。 enter image description here

但我的动画视图在自定义行结束时停止..就像这张图片一样。

enter image description here

我的animation.xml代码,

<?xml version="1.0" encoding="utf-8"?>
 <set
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fillAfter="true"
>

<translate
    android:fromYDelta="0%p"
    android:toYDelta="100%p"
    android:fromXDelta="0%p"
    android:toXDelta="100%p"
    android:duration="1000"

    />

<alpha
    android:duration="500"
    android:fromAlpha="1.0"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:toAlpha="0.0" />

   <scale
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3500"
    android:fromXScale="1.0"
    android:fromYScale="1.0"
    android:toXScale="0.0"
    android:toYScale="0.2" >
</scale>

</set>

注意:如果有人想要更多代码我稍后发布..因为这个qtn已经花了更长的时间..

我的问题,

我的动画文字视图不能超出自定义行的范围。

那么如何将自定义行textview移动到图像的末尾(购物车图片)?

3 个答案:

答案 0 :(得分:6)

目标是将视图从一个位置设置为另一个位置,因此首先我们需要获得两个点。您可以执行以下操作:

int[] screenLocation = new int[2];
textView.getLocationOnScreen(screenLocation);
int startX = screenLocation[0];
int startY = screenLocation[1];

int[] screenLocationB = new int[2];
cartView.getLocationOnScreen(screenLocationB);
int endX = screenLocationB[0];
int endY = screenLocationB[1];

一旦你同时拥有textview的起始位置和你希望它结束​​的位置(cartview的位置),我们需要从下一个点的两点动画。我们可以通过在窗口图层或列表视图上方的framelayout上放置一个新的textview来实现此目的。

这里我们添加到窗口层:

WindowManager.LayoutParams layoutParams = new WindowManager.LayoutParams();
layoutParams.width = view.getMeasuredWidth();
layoutParams.height = view.getMeasuredHeight();
activity.addContentView(newTextView, layoutParams);

接下来我们设定起始位置。

 newTextView.setTranslationX(startX);
 newTextView.setTranslationY(startY);

最后我们动画。

 newTextView.animate().setDuration(300)
       .translationX(endX).translationY(endX).start()

答案 1 :(得分:2)

在TextView的父视图上设置android:clipChildren="false"以及覆盖您想要在其中制作动画的范围的任何祖父母视图。

答案 2 :(得分:2)

我相信this就是你所照顾的。您可以使用名为查看叠加层的内容。您需要的内容类似于第一个动画,其中按钮从其框架下降到屏幕底部。

摘要如下

    final Button button = (Button) findViewById(R.id.button);

    button.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // Our button is added to the parent of its parent, the most top-level layout
            final ViewGroup container = (ViewGroup) button.getParent().getParent();
            container.getOverlay().add(button);

            ObjectAnimator anim = ObjectAnimator.ofFloat(button, "translationY", container.getHeight());

           //You dont need rotation
            ObjectAnimator rotate = ObjectAnimator.ofFloat(button, "rotation", 0, 360);
            rotate.setRepeatCount(Animation.INFINITE);
            rotate.setRepeatMode(Animation.REVERSE);
            rotate.setDuration(350);

            /*
             * Button needs to be removed after animation ending
             * When we have added the view to the ViewOverlay, 
             * it was removed from its original parent.
             */
            anim.addListener(new AnimatorListener() {

                @Override
                public void onAnimationStart(Animator arg0) {
                }

                @Override
                public void onAnimationRepeat(Animator arg0) {
                }

                @Override
                public void onAnimationEnd(Animator arg0) {
                    container.getOverlay().remove(button);
                }

                @Override
                public void onAnimationCancel(Animator arg0) {
                    container.getOverlay().remove(button);
                }
            });

            anim.setDuration(2000);

            AnimatorSet set = new AnimatorSet();
            set.playTogether(anim, rotate);
            set.start();
        }
    });

在您的情况下,您需要正确识别容器。它应该是活动的根本观点。此示例中的按钮也是视图,您将动画(歌曲名称)。最后根据您的要求进行翻译。