当前位置: 动力学知识库 > 问答 > 编程问答 >

android - How to implement Custom listview text animation

问题描述:

I am creating shopping application in android. In my app, I show list of items from custom list view.

If customer select an item, Selected item text moves from listview into shopping cart image. Like below image,

This type of animation is my requirement.

But my animated view stopped at end of custom row.. like this image.

My animation.xml code,

<?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>

Note: If anybody want more code I post later.. because already this qtn take more length..

My question,

My animated textview cannot exceeds bound of custom row.

so How to move custom row textview into end of the image(Shopping cart image)?

网友答案:

The goal is to animate the view from one location to another location so first we need to get the two points. You can do the following:

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];

Once you have both the starting location of the textview and the location you want it to end at (location of the cartview), we need to animate from one point two the next. We can do this by placing a NEW textview on either the window layer or a framelayout above your listview.

Here we add to the window layer:

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

Next we set the starting position.

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

Finally we animate.

 newTextView.animate().setDuration(300)
       .translationX(endX).translationY(endX).start()
网友答案:

I believe this is what you are looking after. You can use something called View Overlay. What you require is similar to the first animation where the button is falling from its frame to bottom of the screen.

The summary is as below

    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();
        }
    });

In your case you need to identify the container properly. It should be the root view of activity. Also the button in the example is view you will be animating (Song name). Finally do the translation according to your requirement.

网友答案:

Set android:clipChildren="false" on the TextView's parent view as well as any grandparent view that covers the range you want to animate inside.

分享给朋友:
您可能感兴趣的文章:
随机阅读: