贝塞尔曲线的解读，可以用于弧形移动动画

关于贝塞尔曲线，就我目前所知的应用场景主要还是View的弧线运动上的运用

说道贝塞尔曲线，那么我们得知道贝塞尔曲线的公式

这里的贝塞尔的动图是从http://blog.csdn.net/u014120638/article/details/51027757这里直接拿来用的，在这里声明一下

一次方公式，两点之间的：

动态效果为：

二次方公式，三点之间的

动态效果为：

三次方公式，四个点之间的

动态效果为：

n次方公式，按照上面自己推敲了：

动态效果，我就不真的拿很多个点了，随意拿个示意一下：

在了解了公式之后，我们就要知道如何在我们的项目中使用这个来达到效果了

首先来一个简单的，二次方公式的演示：

代码：

    float x = 0f;
    float y = 0f;

    private void anim(final View view){
        x = 0f;
        y = 0f;
        final RPoint p0 = new RPoint();//原点坐标就是view的所在
        p0.mX = view.getX();
        p0.mY = view.getY();

        final RPoint p1 = new RPoint();//点p1
        p1.mX = view.getX() + convertDIP2PX(convertDIP2PX(30));
        p1.mY = view.getY() + convertDIP2PX(convertDIP2PX(250));

        final RPoint p2 = new RPoint();//点p2
        p2.mX = view.getX() + convertDIP2PX(convertDIP2PX(60));
        p2.mY = view.getY();

        Log.i("tag","anim:" + view.getX() + ",,," + view.getY());

        ObjectAnimator goInAnim = new ObjectAnimator();
        goInAnim.setFloatValues(0f,1f);
        goInAnim.setDuration(1000);
        goInAnim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator valueAnimator) {
                float t = (float)valueAnimator.getAnimatedValue();
                float oneMinusT = 1.0f - t;

                x = oneMinusT * oneMinusT * (p0.mX)
                        + 2 * t * oneMinusT * (p1.mX)
                        + t * t  * (p2.mX);

                y = oneMinusT * oneMinusT * (p0.mY)
                        + 2 * t * oneMinusT * (p1.mY)
                        + t * t * (p2.mY);
                view.setX(x);
                view.setY(y);
            }
        });
        goInAnim.setTarget(1);
        goInAnim.start();
    }

可以看到，我是按照公式来计算的x坐标和y坐标

我设置的点大概位置如下：

然后我的动画轨迹为：

这个录屏软件不大行，录出来一顿一顿的，可以看到效果的确不错

那么再加一个点来个S形的轨迹？

继续码：

    float x = 0f;
    float y = 0f;

    private void anim(final View view){
        x = 0f;
        y = 0f;
        final RPoint p0 = new RPoint();//原点坐标就是view的所在
        p0.mX = view.getX();
        p0.mY = view.getY();

        final RPoint p1 = new RPoint();//点p1
        p1.mX = view.getX() + convertDIP2PX(convertDIP2PX(30));
        p1.mY = view.getY() + convertDIP2PX(convertDIP2PX(250));

        final RPoint p2 = new RPoint();//点p2
        p2.mX = view.getX() + convertDIP2PX(convertDIP2PX(60));
        p2.mY = view.getY() - convertDIP2PX(convertDIP2PX(250));

        final RPoint p3 = new RPoint();//点p3
        p3.mX = view.getX() + convertDIP2PX(convertDIP2PX(90));
        p3.mY = view.getY();

        ObjectAnimator goInAnim = new ObjectAnimator();
        goInAnim.setFloatValues(0f,1f);
        goInAnim.setDuration(1000);
        goInAnim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator valueAnimator) {
                float t = (float)valueAnimator.getAnimatedValue();
                float oneMinusT = 1.0f - t;


                x = oneMinusT * oneMinusT * oneMinusT * (p0.mX)
                        + 3 * oneMinusT * oneMinusT * t * (p1.mX)
                        + 3 * oneMinusT * t * t * (p2.mX)
                        + t * t * t * (p3.mX);

                y = oneMinusT * oneMinusT * oneMinusT * (p0.mY)
                        + 3 * oneMinusT * oneMinusT * t * (p1.mY)
                        + 3 * oneMinusT * t * t * (p2.mY)
                        + t * t * t * (p3.mY);
                view.setX(x);
                view.setY(y);
            }
        });
        goInAnim.setTarget(1);
        goInAnim.start();
    }

在手机上的坐标：

再来看看运动效果：

我只能说，有意思，这个东西，对于弧形的动画来说，效果的确好很多，就是需要很多效果时需要好好调试一下

不过这部分的知识理解之后，以后有用的时候可以再拿出来了

而在view的绘制的方法中，其实也有贝塞尔曲线的运用，比如：

Path的quadTo(float x1, float y1, float x2, float y2)方法

以当前点为开始点，(x1,y1)为控制点，(x2,y2)为结束点画一条二次贝塞尔曲线

这个方法很有意思