5

我正在尝试实现一个圆形显示动画，其中包括在用户触摸视图时根据用户手指显示视图。

首先，我的观点是在一个无限的圆形显示循环中，只要用户什么都不做，就可以保持圆形的外观。然后当用户触摸视图并开始滑动时，我计算了一个因子ACTION_MOVE来实时增加半径并在每次通过时调用圆形显示。

public void reveal(final View view,
                               final float centerX,
                               final float centerY,
                               final float startRadius,
                               final float endRadius,
                               final int duration) {

                anim = ViewAnimationUtils.createCircularReveal(view, (int)centerX, (int)centerY, (int)startRadius, (int)endRadius);
                anim.setDuration(duration);
                anim.addListener(new Animator.AnimatorListener() {
                    @Override
                    public void onAnimationStart(Animator animation) {
                    }
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        if (isRepeating) {
                            reveal(view,centerX,centerY,startRadius,endRadius,duration);
                        }
                    }
                    @Override
                    public void onAnimationCancel(Animator animation) {
                    }
                    @Override
                    public void onAnimationRepeat(Animator animation) {
                    }
                });
                anim.start();

    }

我再次回忆起在它的 Listener 中使用循环显示方法来创建循环，并且最重要的是避免视觉失真。

我注意到，如果我不这样做，会出现一些非常快速的失真，因为动画持续时间比每次传递都快，ACTION_MOVE因此动画有时间在下一次传递之前完成。失真是动画完成时视图缺失部分的表示，并像闪光灯一样快速返回到使用 Touch 设置的当前半径。

因此，在侦听器内部调用方法的这种方式在此之前工作得很好。

问题： 在我的一台设备上，滑动时各个方向都有无意义的失真。

在此处输入图像描述

根据我的日志，这不是半径失真，因为每次通过后开始和结束半径总是相同的，所以半径不应该像这样移动，尤其是当手指停止时，并且动画永远不会停止，这要感谢我解释的 Listener以上。

我究竟做错了什么 ？

我搜索了很多，没有发现同样的问题，所以我尝试了其他方法，比如绘制画布，但不幸的是它不符合我的需求。

有没有另一种方法可以完全不同地实现这种动画？

提前感谢任何线索

编辑：里面ACTION_MOVE 

 scaleRadius = (float) (2 * distance / maxWidth + startScale);

 if (scaleRadius < 1) {
       scaleRadius = 1;
 }

 animator.reveal(this, middleCircleX, middleCircleY, 
initialCircleRadius*scaleRadius, initialCircleRadius*scaleRadius, 0);

日志： 总是相同的因素，然后半径不应该移动，因为我的手指停止了

2020-03-27 15:42:56.113 onTouch: scaleRadius 1.7870371
2020-03-27 15:42:56.113 onTouch: scaleRadius 1.7870373
2020-03-27 15:42:56.227 onTouch: scaleRadius 1.7870371
2020-03-27 15:42:56.227 onTouch: scaleRadius 1.7870373
2020-03-27 15:42:56.331 onTouch: scaleRadius 1.7870374
2020-03-27 15:42:56.331 onTouch: scaleRadius 1.7870371
4

1 回答 1

1

我假设你不想要闪烁的动画，而是你的圆的半径平滑过渡，并且随着你在屏幕上滑动的距离而变大或变小。（如果这个假设是错误的，请纠正我）

我将假设centerXandcenterY始终是相同的值，并且基本上是全局变量。

创建几个额外的全局变量：

boolean animIsCurrentlyPlaying=false; 
float mCurrentRadius=initialCircleSize; //i guess this is 1 in your case
float mTargetRadius;

现在，在ACTION_MOVE活动中，您将执行以下操作：

1-设置mTargetRadius为屏幕上手指之间的距离centerX和centerY位置的一些函数（欧几里德距离可能是一个很好的选择，这里是一个例子）；

mTargetRadius=Float.valueOf(Math.sqrt((double)(Math.pow(event.getX()-centerX,2)+Math.pow(event.getY()-centerY,2))));

2-执行以下方法revealModified(view, 100);

public void revealModified(final View view,
                           final int duration) {
       if(!animIsCurrentlyPlaying){
            //here i just reference the global vars
            anim = ViewAnimationUtils.createCircularReveal(view, centerX, centerY, mCurrentRadius, mTargetRadius);
            mCurrentRadius=mTargetRadius;
            anim.setDuration(duration);
            anim.addListener(new Animator.AnimatorListener() {

                @Override
                public void onAnimationEnd(Animator animation) {

                    animIsCurrentlyPlaying=false;
                    if(mCurrentRadius!=mTargetRadius){
                         revealModified(view, 100);
                    }
                }

            });
            animIsCurrentlyPlaying=true;
            anim.start();
       }

}

每次您轻轻移动手指时，都会执行该方法。我将持续时间设置为 100 毫秒，但如果您发现它不够反应，则可以更短。每当您移动手指时，都会设置一个标志，因此无法在顶部启动其他动画并且过渡始终是平滑的。如果您在播放动画时移动手指，revealModified则将在 onAnimationEnd 内的 if 语句中重新执行。

让我知道它是否有效，特别是如果这是你想要的

于 2020-03-25T03:29:23.837 回答