0

我正在开发一个项目，该项目要求以类似于 Zazzle 应用程序执行其导航栏的方式来实现导航栏。动画不是我的专长，所以我想从开发社区获得一些关于如何实现这样的动画的想法。

这是导航抽屉的图像，请注意前一个片段如何保持在左侧的视图中。

Zazzle_navigation_Drawer

这是按下菜单按钮时导航转换的屏幕截图。它转身并把自己藏在屏幕的右侧，当菜单被关闭时，它会反转这个过程。

Zazzle_nav_transition

我正在寻找有关如何实现此功能的建议，以及我应该研究使用的一些资源或要学习的信息，以便很好地复制这种效果。

到目前为止我所做的。

我已经观看并记录了 Sliding Animations DevBytes 视频。所以到目前为止，我的策略是让导航与我所有的其他屏幕一起成为一个片段，并尝试在它们之间实现一些滑动动画。我认为这应该给我一个基本的基础。

因此，我更多地询问动画将如何构建。我以前从未做过动画，所以我寻求一些关于如何在 android 中实现自定义动画的帮助，以及在这种情况下具体如何完成动画的建议

4

1 回答 1

0

如果有人偶然发现这...

我通过使用Android 开发人员培训网站上的示例项目解决了这个问题。我在 res 中创建了一个 anim 文件夹，并使用 Object animator 标签添加了 xml 集文件。我不明白如何正确操作这些值以获得所需的动画，但经过一番摸索后，我意识到以下几点

 <objectAnimator
    android:valueFrom=
    android:valueTo=
    android:propertyName="
    android:interpolator=
    android:duration= />

valueFrom 标记和 valueTo 标记定义了动画运行的点，其余部分由 android 填充。属性名称用于描述正在操作的运动类型（translationX、translationY、rotationX、translationY、scaleX 和 scaleY）。插值器设置动画的变化率，最后持续时间指定动画应该花费多长时间。

制作动画文件后，可以使用以下代码在事务期间在片段上设置动画。

 getFragmentManager()
                    .beginTransaction()        
                    .setCustomAnimations(
                            R.animator.exampleOut, R.animator.exampleIn,
                            R.animator.exampleOut, R.animator.exampleIn, 
                    ).add(R.id.container, new mFragment()).addToBackStack(null).commit();\

setCustomAnimations() 的前两个参数设置事务启动时两个片段的动作，后两个参数设置事务反转时两个片段的动作，即按下返回按钮。

这可用于实现所需的动画，但是我发现出站片段由于某种原因会从视图中消失。因此我不得不使用 AnimatorListener 如下：

Animator.AnimatorListener listener = new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator arg0) {
            getFragmentManager()
                    .beginTransaction()        
                    .setCustomAnimations(
                            R.animator.exampleOut, 0,
                            0, R.animator.exampleIn
                    )


                    .add(R.id.container, new mFragment())

                    .addToBackStack(null)

                    .commit();
        }
    };
    slideback(listener);

    mHandler.post(new Runnable() {
        @Override
        public void run() {
            invalidateOptionsMenu();
        }
    });
}

private void slideback(Animator.AnimatorListener listener) {
    View movingFragmentView = cardFrontFragment.getView();

    PropertyValuesHolder rotateY =  PropertyValuesHolder.ofFloat("rotationY", 15f);
    PropertyValuesHolder scaleX =  PropertyValuesHolder.ofFloat("scaleX", 0.8f);
    PropertyValuesHolder scaleY =  PropertyValuesHolder.ofFloat("scaleY", 0.8f);
    PropertyValuesHolder translateX = PropertyValuesHolder.ofFloat("translationX", 500f);
    ObjectAnimator movingFragmentAnimator = ObjectAnimator.
            ofPropertyValuesHolder(movingFragmentView, rotateY, scaleX, scaleY, translateX);



    ObjectAnimator movingFragmentRotator = ObjectAnimator.
            ofFloat(movingFragmentView, "rotationY",15f, 0f);
    movingFragmentAnimator.setDuration(DURATION_TIME);
    movingFragmentRotator.setStartDelay(DELAY_TIME);


    AnimatorSet s = new AnimatorSet();
    s.playTogether(movingFragmentAnimator, movingFragmentRotator);
    s.addListener(listener);
    s.start();
}
private void slideForward (Animator.AnimatorListener listener) {
    View movingFragmentView = cardFrontFragment.getView();

    PropertyValuesHolder rotateY =  PropertyValuesHolder.ofFloat("rotationY", 15f);
    PropertyValuesHolder scaleX =  PropertyValuesHolder.ofFloat("scaleX", 1.0f);
    PropertyValuesHolder scaleY =  PropertyValuesHolder.ofFloat("scaleY", 1.0f);
    PropertyValuesHolder translateX = PropertyValuesHolder.ofFloat("translationX", 0f);
    ObjectAnimator movingFragmentAnimator = ObjectAnimator.
            ofPropertyValuesHolder(movingFragmentView, rotateY, scaleX, scaleY, translateX);



    ObjectAnimator movingFragmentRotator = ObjectAnimator.
            ofFloat(movingFragmentView, "rotationY",15f, 0f);
    movingFragmentAnimator.setDuration(DURATION_TIME);
    movingFragmentRotator.setStartDelay(DELAY_TIME);
    movingFragmentRotator.setDuration(DURATION_TIME);


    AnimatorSet s = new AnimatorSet();
    s.playTogether(movingFragmentAnimator, movingFragmentRotator);
    s.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
           mShowingBack = false;
        }
    });
    s.start();
}

这允许您在运行时动态设置出站片段的属性，并且出于某种原因允许片段保留在视图中。

于 2014-08-17T10:51:08.063 回答