Android自定义view-仿华为运动健康手势移动控件

       先从简单的来，首先绘制跟随手势移动的小圆，这个比较简单 

canvas.drawCircle(circleCenterX, circleCenterY, circleRadius, circlePaint);
复制代码

       然后绘制跟随小圆移动的曲线以及曲线所在上面白色部分，这里需要使用到贝塞尔曲线进行曲线的绘制，一开始使用的是二阶的绘制方法，发现效果不好，然后改用的分成两段三阶贝塞尔曲线的绘制方法（看下图），效果就圆润多了。这里附上贝塞尔曲线传送门

private void drawLine(Canvas canvas) {    
    linePath.reset();    
    linePath.moveTo(0, circleCenterY);    
    linePath.lineTo(circleCenterX - circleRadius - 60, circleCenterY);    
    linePath.cubicTo(circleCenterX - circleRadius, circleCenterY, circleCenterX - circleRadius - 5            , circleCenterY - circleRadius - 10, circleCenterX, circleCenterY - circleRadius - 10);    
    linePath.cubicTo(circleCenterX + circleRadius + 5, circleCenterY - circleRadius - 10            , circleCenterX + circleRadius, circleCenterY, circleCenterX + circleRadius + 60, circleCenterY);
    linePath.lineTo(viewWidth, circleCenterY);    
    linePath.lineTo(viewWidth, 0);    
    linePath.lineTo(0, 0);    
    linePath.close();    
    canvas.drawPath(linePath, cruveLinePaint);
}
复制代码