Android绘制波浪线

今天让我们来绘制一条波浪线，并且提供了控制波浪大小和波浪速度的方法，首先我们来看看完成的效果：

效果是不是还不错，接下来我们就来看看具体怎么实现的吧！

如果你学会了这种绘制波浪线的方式，可以了解下波浪线的进阶画法：
Android绘制波浪线 进阶

---

实现思路

波浪线的绘制
波浪线是怎么实现的呢，其实这用到的内塞尔曲线。
大家可以在这里看看贝塞尔曲线的使用方式。——贝塞尔曲线开发的艺术

使用一阶贝塞尔曲线画出前半截凸起的曲线，再使用一阶贝塞尔曲线画出后半截的贝塞尔曲线。
具体实现方式，为了看着简单点，我就直接写数字了。

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setAntiAlias(true);
        paint.setStrokeWidth(5);
        paint.setStyle(Paint.Style.STROKE);

        Path path = new Path();

        path.moveTo(0, 500);
        path.quadTo(screenWidth / 4, 300, screenWidth / 2, 500);
        path.moveTo(screenWidth / 2, 500);
        path.quadTo(screenWidth / 4 * 3, 700, screenWidth, 500);

        canvas.drawPath(path, paint);

    }

效果大概是这个样子：

波浪的动态
大家有没有觉得这个波浪线很像y=sinx这个函数图像，只要y=sin(x+a)，a是一个随着时间无限增大的值，该函数图像就可以动起来，大家可以在这个网站上试试——Desmos图形计算器
大概要输入一个这样的函数：y=sin(x/5+a)，a做为一个滑块。这样大家就可以看到波浪线的动态图了。

好了，点子已经有了，只要我们把那个波浪线向后移动，就可以看出波浪的动态效果，于是我们做出了如下代码：

    private int screenWidth;

    private float xoffset = 0;

    public MyView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);

        WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
        screenWidth = wm.getDefaultDisplay().getWidth();

        ValueAnimator animator = new ValueAnimator();
        animator.setFloatValue