0

I have 4 clickable images surounding the center of my screen. Upon clicking one of the images I want the image to slide from it's current position to the center of the screen.

Once the image reaches the center of the screen I would like the image to flip and then have my fragment load.

How do I obtain this full sequence? I have my fragment loading but I am unsure of how to create an animation that slides my image from it's current position to the center. The layout of the page is know and is as follows.

1 2 3

4 5 6

7 8 9

where 2, 4, 6, 8 are my images that I want to slide and 5 is the position that I want them to slide to on click (then flip and show my fragment).

Thanks, Dman

EDIT :

One thing I cannot get to occur is the events to play in sequence. Currently when i click the image it waits the offset that I have set on the flip_image.xml animation and then plays them all at once in the duration given to the flip_image.xml animation. Any help on this would be much appreciated.

slide_left.xml

<?xml version="1.0" encoding="utf-8"?>
<translate 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:fromXDelta="0%" 
    android:toXDelta="-112%"
    android:duration="1000"/>

slide_alpha.xml

<?xml version="1.0" encoding="utf-8"?>
<alpha 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:fromAlpha="0.8"
    android:toAlpha="1.0"
    android:duration="1000" />

flip_image.xml

<?xml version="1.0" encoding="utf-8"?>
<scale
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.0"
    android:pivotX="50%"
    android:fromYScale="1.0"
    android:toYScale="1.0"
    android:startOffset="1000"
    android:duration="200" />

Calling Code:

private void loadFragmentAnimation(final ImageView view, final int slideDirection) {
        AnimationSet animSet = new AnimationSet(true);
        animSet.addAnimation(AnimationUtils.loadAnimation(getActivity(), slideDirection));
        animSet.addAnimation(AnimationUtils.loadAnimation(getActivity(), R.anim.slide_alpha));
        animSet.addAnimation(AnimationUtils.loadAnimation(getActivity(), R.anim.flip_image));
        animSet.setAnimationListener(new AnimationListener() {

            public void onAnimationStart(Animation animation) {             
            }

            public void onAnimationRepeat(Animation animation) {                
            }

            public void onAnimationEnd(Animation animation) {
                // mCallBack.categorySelected(view.getId());
            }
        });

        view.startAnimation(animSet);
    }
4

1 回答 1

0

使用查看动画

  1. 创建一个AnimationSet有 aTranslateAnimation 后跟 aScaleAnimation来模拟翻转(您可能需要将图像镜像到翻转的另一侧。也许有更简单的方法?)。
  2. 然后将动画设置为ImageViewusing setAnimation()

我想您也应该能够在 XML 中指定动画。

编辑:

翻转动画可以参考以下链接:

于 2012-12-03T16:03:31.713 回答