Recently bought a Huawei bracelet, ready to run with, did not think there is no decent running place nearby, can only give up! Accidentally saw the page of sleep monitoring, there is a gesture sliding control, which makes people feel very comfortable, and then generated interest, germination out of the idea

Start with the simple one. First draw a circle that follows the gesture. This one is easier

canvas.drawCircle(circleCenterX, circleCenterY, circleRadius, circlePaint);
Copy the code

Then draw with small round curve and curve lies above the white part of the move, there needs to be used to bezier curve drawing, started using the second order of drawing method, found that the result is bad, then switch to the third order Bessel curve is divided into two sections of a drawing method (see below), the effect is much more rounded. Attached is the Bezier curve portal

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);
}
Copy the code

Finally, the primary school math section, as the small circle moves, the time text above will move up and down

Here is basically done, if the students have any good implementation method, or have any suggestions, welcome to leave a message, discuss learning together! Finally, attach the renderings and source code address

Open source is not easy, please respect the author’s labor, reprint please indicate the source

Welcome Github follow, light up the star in the upper right corner, is the biggest incentive to give!

Github source address github.com/jianjiucode…