我正在尝试为 Android 中的一些 drawables 设置动画，我已经使用 PathEvaluator 设置了路径沿完整路径沿某些曲线进行动画处理。

当我设置 duration(例如 6 秒)时，它会将持续时间拆分为我设置的曲线数量，而不管它们的长度如何导致动画在某些 fragment 上变慢对别人快。

在 iOS 上，可以使用以下方法修复此问题

animation.calculationMode   = kCAAnimationCubicPaced;
animation.timingFunction    = ...;

这让 iOS 可以将您的整个路径平滑到中间点，并根据每个 fragment 的长度跨越持续时间。 有什么方法可以在 Android 中获得相同的结果？

(除了将路径分成离散的段并手动为每个段分配自己的持续时间之外，这非常丑陋且无法维护)。

最佳答案

我不认为 ObjectAnimator 可以做任何事情，因为似乎没有可以调用的函数来断言某个动画 fragment 的相对持续时间。

我确实开发了一些与您前阵子需要的类似的东西，但它的工作方式略有不同 - 它继承自 Animation。

我已经修改了所有内容以满足您的曲线需求和 PathPoint 类。

这是一个概述:

1. 我在构造函数中向动画提供点列表。

2. 我使用一个简单的距离计算器计算所有点之间的长度。然后我将所有这些相加得到路径的总长度，并将分段长度存储在 map 中以备将来使用(这是为了提高运行时的效率)。

3. 制作动画时，我使用当前插值时间来确定我在哪 2 个点之间制作动画，同时考虑时间比率和行进距离比率。

4. 我根据它们之间的相对距离(与总距离相比)计算在这两个点之间制作动画所需的时间。

5. 然后我使用 PathAnimator 类中的计算分别在这 2 个点之间进行插值。

代码如下:

曲线动画.java:

public class CurveAnimation extends Animation 
{
    private static final float BEZIER_LENGTH_ACCURACY = 0.001f; // Must be divisible by one. Make smaller to improve accuracy, but will increase runtime at start of animation.
    private List<PathPoint> mPathPoints;
    private float mOverallLength;
    private Map<PathPoint, Double> mSegmentLengths = new HashMap<PathPoint, Double>(); // map between the end point and the length of the path to it.

    public CurveAnimation(List<PathPoint> pathPoints)
    {
        mPathPoints = pathPoints;

        if (mPathPoints == null || mPathPoints.size() < 2)
        {
            Log.e("CurveAnimation", "There must be at least 2 points on the path. There will be an exception soon!");
        }

        calculateOverallLength();
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) 
    {       
        PathPoint[] startEndPart = getStartEndForTime(interpolatedTime);

        PathPoint startPoint = startEndPart[0];
        PathPoint endPoint = startEndPart[1];

        float startTime = getStartTimeOfPoint(startPoint);
        float endTime = getStartTimeOfPoint(endPoint);      
        float progress = (interpolatedTime - startTime) / (endTime - startTime);


        float x, y;
        float[] xy;
        if (endPoint.mOperation == PathPoint.CURVE) 
        {
            xy = getBezierXY(startPoint, endPoint, progress);
            x = xy[0];
            y = xy[1];
        } 
        else if (endPoint.mOperation == PathPoint.LINE) 
        {
            x = startPoint.mX + progress * (endPoint.mX - startPoint.mX);
            y = startPoint.mY + progress * (endPoint.mY - startPoint.mY);
        } 
        else 
        {
            x = endPoint.mX;
            y = endPoint.mY;
        }              

        t.getMatrix().setTranslate(x, y);
        super.applyTransformation(interpolatedTime, t);
    }


    private PathPoint[] getStartEndForTime(float time)
    {       
        double length = 0;

        if (time == 1)
        {
            return new PathPoint[] { mPathPoints.get(mPathPoints.size() - 2), mPathPoints.get(mPathPoints.size() - 1) }; 
        }

        PathPoint[] result = new PathPoint[2];

        for (int i = 0; i < mPathPoints.size() - 1; i++)
        {
            length += calculateLengthFromIndex(i);
            if (length / mOverallLength >= time)
            {
                result[0] = mPathPoints.get(i);
                result[1] = mPathPoints.get(i + 1);
                break;
            }
        }

        return result;
    }

    private float getStartTimeOfPoint(PathPoint point)
    {
        float result = 0;
        int index = 0;          

        while (mPathPoints.get(index) != point && index < mPathPoints.size() - 1)
        {
            result += (calculateLengthFromIndex(index) / mOverallLength);
            index++;
        }

        return result;

    }

    private void calculateOverallLength()
    {
        mOverallLength = 0;      
        mSegmentLengths.clear();

        double segmentLength;

        for (int i = 0; i < mPathPoints.size() - 1; i++)
        {
            segmentLength = calculateLengthFromIndex(i);
            mSegmentLengths.put(mPathPoints.get(i + 1), segmentLength);
            mOverallLength += segmentLength;
        }
    }

    private double calculateLengthFromIndex(int index)
    {
        PathPoint start = mPathPoints.get(index);
        PathPoint end = mPathPoints.get(index + 1);
        return calculateLength(start, end);
    }

    private double calculateLength(PathPoint start, PathPoint end)
    {
        if (mSegmentLengths.containsKey(end))
        {
            return mSegmentLengths.get(end);
        }       
        else if (end.mOperation == PathPoint.LINE)
        {
            return calculateLength(start.mX, end.mX, start.mY, end.mY);
        }
        else if (end.mOperation == PathPoint.CURVE)
        {
            return calculateBezeirLength(start, end);
        }
        else
        {
            return 0;
        }
    }

    private double calculateLength(float x0, float x1, float y0, float y1)
    {
        return Math.sqrt(((x0 - x1) * (x0 - x1)) + ((y0 - y1) * (y0 - y1)));
    }

    private double calculateBezeirLength(PathPoint start, PathPoint end)
    {
        double result = 0;  
        float x, y, x0, y0;
        float[] xy;

        x0 = start.mX;
        y0 = start.mY;              

        for (float progress = BEZIER_LENGTH_ACCURACY; progress <= 1; progress += BEZIER_LENGTH_ACCURACY)
        {
            xy = getBezierXY(start, end, progress);
            x = xy[0];
            y = xy[1];

            result += calculateLength(x, x0, y, y0);

            x0 = x;
            y0 = y;
        }

        return result;
    }

    private float[] getBezierXY(PathPoint start, PathPoint end, float progress)
    {
        float[] result = new float[2];

        float oneMinusT, x, y;  

        oneMinusT = 1 - progress;
        x = oneMinusT * oneMinusT * oneMinusT * start.mX +
                3 * oneMinusT * oneMinusT * progress * end.mControl0X +
                3 * oneMinusT * progress * progress * end.mControl1X +
                progress * progress * progress * end.mX;
        y = oneMinusT * oneMinusT * oneMinusT * start.mY +
                3 * oneMinusT * oneMinusT * progress * end.mControl0Y +
                3 * oneMinusT * progress * progress * end.mControl1Y +
                progress * progress * progress * end.mY;

        result[0] = x;
        result[1] = y;

        return result;
    }

}

下面是一个演示如何激 Activity 画的示例:

private void animate()
    {
        AnimatorPath path = new AnimatorPath();
        path.moveTo(0, 0);
        path.lineTo(0, 300);
        path.curveTo(100, 0, 300, 900, 400, 500);        

        CurveAnimation animation = new CurveAnimation(path.mPoints);
        animation.setDuration(5000);
        animation.setInterpolator(new LinearInterpolator());

        btn.startAnimation(animation);
    }

现在请记住，我目前正在根据近似值计算曲线的长度。这显然会导致速度出现一些轻微的误差。如果您觉得不够准确，请随时修改代码。此外，如果您想增加曲线的长度精度，请尝试减小 BEZIER_LENGTH_ACCURACY 的值。它必须能被 1 整除，因此可接受的值可以是 0.001、0.000025 等。

虽然您可能会注意到在使用曲线时速度会有一些轻微的波动，但我相信这比简单地将时间平均分配给所有路径要好得多。

希望对您有所帮助:)

关于iOS "calculationMode"等效的 Android 动画，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19076598/