翻译(曲线路径)+缩放动画Android

时间:2016-05-11 20:45:58

标签: android

enter image description here

我想在曲线中翻译图像视图,同时在翻译时缩放它。

我已经过去了 多个帖子就好 https://stackoverflow.com/a/30254927/3518278 我无法弄清楚如何计算我的路径变量

也 这里提到android 5提供了极间的基本曲线 https://stackoverflow.com/a/26591870/3518278 但它们似乎没有效果。

我目前的代码是

View view;
        ValueAnimator animator = ValueAnimator.ofFloat(0, 1); // values from 0 to 1
        animator.setDuration(5000); // 5 seconds duration from 0 to 1
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener()
        {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                float value = ((Float) (animation.getAnimatedValue()))
                        .floatValue();
                // Set translation of your view here. Position can be calculated
                // out of value. This code should move the view in a half circle.
                img_fullscreen_drone.setTranslationX((float)(150.0 * Math.sin(value*Math.PI)));
                img_fullscreen_drone.setTranslationY((float)(150.0 * Math.cos(value*Math.PI)));
                img_fullscreen_drone.setScaleType(ImageView.ScaleType.CENTER);
                img_fullscreen_drone.animate().scaleX(0.5f).scaleY(0.5f).setDuration(5000).start();

            }
        });

        animator.start();

这可以在圆弧中翻译我的视图,但是在翻译完成比例开始后,我想要缩放并沿着曲线进行转换。

任何帮助都将被提升

先谢谢

3 个答案:

答案 0 :(得分:5)

原始代码重新启动了转换图像的动画的每一帧的缩放动画。您只需将缩放动画代码移出更新块,如下所示。

请注意,您使用两种略有不同的动画方法,用于缩放与翻译,这可能让您感到困惑。

    View view;
    ValueAnimator animator = ValueAnimator.ofFloat(0, 1); // values from 0 to 1
    animator.setDuration(5000); // 5 seconds duration from 0 to 1
    animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener()
    {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            float value = ((Float) (animation.getAnimatedValue()))
                    .floatValue();
            // Set translation of your view here. Position can be calculated
            // out of value. This code should move the view in a half circle.
            img_fullscreen_drone.setTranslationX((float)(150.0 * Math.sin(value*Math.PI)));
            img_fullscreen_drone.setTranslationY((float)(150.0 * Math.cos(value*Math.PI)));
        }
    });

    animator.start();

    img_fullscreen_drone.setScaleType(ImageView.ScaleType.CENTER);
    img_fullscreen_drone.animate().scaleX(0.5f).scaleY(0.5f).setDuration(5000).start();

答案 1 :(得分:1)

在摆弄了Joel的回答之后,我发现你也可以使用ViewPropertyAnimator并以这种方式一次性写出来:

img_fullscreen_drone.setScaleType(ImageView.ScaleType.CENTER);
img_fullscreen_drone.animate()
  .setUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        float value = ((Float) (animation.getAnimatedValue()));
        // Set translation of your view here. Position can be calculated
        // out of value. This code should move the view in a half circle.
        img_fullscreen_drone.setTranslationX((float)(150.0 * Math.sin(value*Math.PI)));
        img_fullscreen_drone.setTranslationY((float)(150.0 * Math.cos(value*Math.PI)));
    }})
  .scaleX(0f).scaleY(0f)
  .setDuration(5000)
  .start();

未经测试我认为它应该可以正常工作。

答案 2 :(得分:-1)

首先设置动画制作者。像

这样的东西
AnimatorSet set = new AnimatorSet();

然后你必须分开你的2个动画,它们是动画师的形式,你可以做的翻译和缩放

供翻译使用:

ObjectAnimator translateAnimator = ObjectAnimator.ofInt(view, "y", toValue);

你可以做同样的规模。然后你可以一起玩

set.playTogether(translateAnimator, scaleAnimator);

这应该缩放并一起翻译。