翻译动画从屏幕开始而不是它所属的地方

Translation animation starts off screen instead of where it belongs

所以我们正在尝试制作一个动画,在 FAB 消失并打开工具栏之前移动它。问题是当我 运行 FAB 的 TranslationAnimation 消失然后从屏幕外滑入时。 fromxDelta 和 fromYDelta 的行为也不符合我的预期。

任何人都可以指出我做错了什么或帮助我理解这个调用是如何工作的吗?

private void circularReveal(View toolbar, View fab) {
    final View view1 = toolbar;

    // get the center for the clipping circle
    int cx = (toolbar.getLeft() + toolbar.getRight()) / 2;
    int cy = (toolbar.getTop() + toolbar.getBottom()) / 2;

    // get the final radius for the clipping circle
    int finalRadius = Math.max(toolbar.getWidth(), toolbar.getHeight());

    // create the animator for this view (the start radius is zero)
    final SupportAnimator anim = ViewAnimationUtils.createCircularReveal(toolbar, cx, cy, 0, finalRadius);
    //todo create an animation to move the fab.

    TranslateAnimation translateAnimation = new TranslateAnimation(Animation.ABSOLUTE, 0f,
                                                                Animation.ABSOLUTE , -100f,
                                                                Animation.ABSOLUTE , 0f,
                                                                Animation.ABSOLUTE , -100f);
    translateAnimation.setDuration(2000L);
    translateAnimation.setFillAfter(true);
    Animation.AnimationListener animationListener = new Animation.AnimationListener() {

        @Override
        public void onAnimationStart(Animation animation) {

        }

        @Override
        public void onAnimationEnd(Animation animation) {
            view1.setVisibility(View.VISIBLE);
            anim.start();
        }

        @Override
        public void onAnimationRepeat(Animation animation) {

        }
    };
    translateAnimation.setAnimationListener(animationListener);
    fab.startAnimation(translateAnimation);
}

EDIT 我清理了代码片段中的一些变量名。

So we are trying to make an animation that moves the FAB before it disappears and opens a toolbar.

你的代码读起来是相反的。看起来您正在对名为 'toolbar' 的视图应用 TranslateAnimation,并在 FloatingActionButton.

上使用循环显示

无论如何,我猜你正在尝试实现这样的目标:

private void circularReveal(final View view, View toolbar) {

    // get the center for the clipping circle
    int cx = (toolbar.getLeft() + toolbar.getRight()) / 2;
    int cy = (toolbar.getTop() + toolbar.getBottom()) / 2;

    // get the final radius for the clipping circle
    int finalRadius = Math.max(toolbar.getWidth(), toolbar.getHeight());

    // create the animator for this view (the start radius is zero)
    final Animator anim = ViewAnimationUtils.createCircularReveal(toolbar, cx, cy, 0, finalRadius);

    view.animate()
            .translationX(-100)
            .translationY(-100)
            .setDuration(2000)
            .setListener(new Animator.AnimatorListener() {
                @Override
                public void onAnimationStart(Animator animation) {

                }

                @Override
                public void onAnimationEnd(Animator animation) {
                    view.setVisibility(View.INVISIBLE);  // set this to INVISIBLE if you want your FAB to dissapear 
                    anim.start();
                }

                @Override
                public void onAnimationCancel(Animator animation) {

                }

                @Override
                public void onAnimationRepeat(Animator animation) {

                }
            });

}

这会在工具栏显示并且 FAB 消失之前将 FAB 稍微向左和向上移动。

调用此方法时首先将 FAB 作为参数,将 ToolBar 作为第二个参数。

我省略了 TranslateAnimation and used ViewPropertyAnimator 因为 TranslateAnimation 并没有真正移动视图而只是移动屏幕上的像素,而 ViewPropertyAnimator 改变了视图的实际定位。 TranslateAnimation 的问题是您仍然可以点击 FAB 所在的旧位置,它仍然会触发 FAB OnClickListener。