最近因工作需要做了一个Android基本开发的培训，这里把其中Android贝塞尔曲线应用的章节部分拿出来分享。先上图看效果，包括水纹波动以及利用水纹波动实现车辆监控两种效果图，本文主要讲解怎么利用贝塞尔二次曲线实现水纹波动效果。
贝塞尔曲线的得名是由于 1962 年就职于雷诺的法国工程师Pierre Bézier的广泛宣传。他使用这种只需要很少的控制点就能够生成复杂平滑曲线的方法，来辅助汽车车体的工业设计。正是因为控制简便却具有极强的描述能力，贝塞尔曲线在工业设计领域迅速得到了广泛的应用。
如何用de Casteljau算法绘制一条贝塞尔曲线，请参考网上其它文章。贝塞尔曲线是用一系列点来控制曲线状态的，可以将这些点简单分为两类：数据点（确定曲线的起始和结束位置）、控制点（确定曲线的弯曲程度）。通过调整控制点贝塞尔曲线形状会发生变化。
2、Android贝塞尔曲线常用函数Android中Path类中已经有封装好了的关于贝塞尔曲线的函数。
//二阶贝赛尔 public void quadTo(float x1, float y1, float x2, float y2) public void rQuadTo(float dx1, float dy1, float dx2, float dy2) //三阶贝赛尔 public void cubicTo(float x1, float y1, float x2, float y2,float x3, float y3) public void rCubicTo(float x1, float y1, float x2, float y2,float x3, float y3)
2.1、cubicTo()
查看quadTo()函数源码看到其参数中(x1,y1)是控制点坐标，(x2,y2)是终点坐标。整条线的起始点是通过Path.moveTo(x,y)来指定的，而如果我们连续调用quadTo()，前一个quadTo()的终点，就是下一个quadTo()函数的起点。如果初始没有调用Path.moveTo(x,y)来指定起始点，则默认以控件左上角(0,0)为起始点。
2.2、rQuadTo()
rQuadTo()函数参数与quadTo()不同，具体说明如下：
dx1:控制点X坐标，表示相对上一个终点X坐标的位移坐标，可为负值，正值表示相加，负值表示相减；
dy1:控制点Y坐标，相对上一个终点Y坐标的位移坐标。同样可为负值，正值表示相加，负值表示相减；
dx2:终点X坐标，同样是一个相对坐标，相对上一个终点X坐标的位移值，可为负值，正值表示相加，负值表示相减；
dy2:终点Y坐标，同样是一个相对，相对上一个终点Y坐标的位移值。可为负值，正值表示相加，负值表示相减；
假如我们上一个终点坐标是(300,400)，那么利用rQuadTo(100,-100,200,100)； 得到的控制点坐标是（300 100,400-100）即(500,300) 同样，得到的终点坐标是(300 200,400 100)即(500,500)，这个方法使用上和quadTo()方法没什么区别。
2.3、cubicTo()
这是Android的三阶贝塞尔曲线方法，查看源码可以看到参数(x1,y1)是第一个控制点坐标，(x2,y2)是第二个控制点坐标，(x3，y3)是终点坐标。同样整条线的起始点是通过Path.moveTo(x,y)来指定的，而如果我们连续调用cubicTo()，前一个cubicTo()的终点，就是下一个cubicTo()函数的起点；如果初始没有调用Path.moveTo(x,y)来指定起始点，则默认以控件左上角(0,0)为起始点。
2.4、rCubicTo()方法源码
参数说明同rQuadTo。
3、水纹波动效果为了实现连续的波动效果，我们需要在屏幕内和屏幕外各画一个完整波纹，然后不间断进行水平方向平移动画。
首先是采用贝塞尔二次曲线画出两个完整波纹，即对上图中AB、BC、CD、DE曲线段利用贝塞尔二次曲线rQuadTo画出。核心代码是drawWave()这个方法，其中mWaveDx是计算出的屏幕宽度，mWaveHeight是贝塞尔曲线控制点高度，dx是动画每次的偏移量。
private void drawWave(Canvas canvas) { Path path = new Path(); path.reset(); path.moveTo(-mWaveDx dx, mHeight / 2); for (int i = -mWaveDx; i < getWidth() mWaveDx; i = mWaveDx) { path.rQuadTo(mWaveDx / 4, -mWaveHeight, mWaveDx / 2, 0); path.rQuadTo(mWaveDx / 4, mWaveHeight, mWaveDx / 2, 0); } path.lineTo(mWidth, mHeight); path.lineTo(0, mHeight); //path.close() 绘制封闭的区域 path.close(); canvas.drawPath(path, mPaint); }
完整的波纹已经画出，下面就是实现波动效果。这里借助ValueAnimator对贝塞尔曲线不断绘制，并生成一个偏移量dx，使得每次绘制的起点平滑右移，从而实现水纹波动效果。
ValueAnimator属性动画的运行机制是通过不断地对值进行操作来实现的，而初始值和结束值之间的动画过渡就是由ValueAnimator这个类来负责计算的。它的内部使用一种时间循环的机制来计算值与值之间的动画过渡，我们只需要将初始值和结束值提供给ValueAnimator，并且告诉它动画所需运行的时长，那么ValueAnimator就会自动完成从初始值平滑地过渡到结束值这样的效果。
public void waveAnimation() { // valueAnimator对象，初始值为0，结束值为mWaveDx，mWaveDx为整个屏幕宽度 ValueAnimator valueAnimator = ValueAnimator.ofInt(0, mWaveDx); // 设置属性动画时长 valueAnimator.setDuration(2000); // 无线重复动画 valueAnimator.setRepeatCount(ValueAnimator.INFINITE); valueAnimator.setInterpolator(new LinearInterpolator()); valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { //水平方向的偏移量，值的区间为0~mWaveDx，根据偏移量重绘贝塞尔曲线 dx = (int)animation.getAnimatedValue(); invalidate(); } }); valueAnimator.start(); }
最终效果图就是文章开头供图，只给出了静态截图，实际演示动态效果可以下载源码运行，下载地址https://download.csdn.net/download/wangpf2011/10986376。
,
