How to draw Arc between two points on the Canvas?

后端 未结 7 1216
渐次进展
渐次进展 2020-11-28 04:27

I have two points in the canvas, now I\'m able to draw a line between those points like this below image by using

This code canvas.drawLine(p1.x, p1.y, p2.x,

7条回答
  •  悲哀的现实
    2020-11-28 04:42

    I was trying to do something a little different and it's all about calculating sweep and start angles.

    I wanted to show an arc that represents progress on a circle that goes from top to bottom.

    So I had progress value from 0...100 and I want to show an arc that start from top to bottom to fill the circle when the progress is 100.

    To calculate the sweepAngle I use:

        int sweepAngle = (int) (360 * (getProgress() / 100.f));
    

    Next is to calculate the startAngle

        int startAngle = 270 - sweepAngle / 2;
    

    Start Angle is calculated this way because:

    1. It's always going to start from the left side, starting from the top to bottom. So starting angle at the top equals 270 (Note that it goes clockwise and 0 = 3 o'clock, so 12 o'clock equals 270 degrees)
    2. Next I want to calculate how far I'm going to get away from my starting point (270) and to do that I only calculate half of the sweep angle because only half of the arc will be on the left side and the other half on the right side.

    So considering I have progress of 25%

    sweepAngle = 90 degrees (90 degrees is quarter of a circle)
    start angle = 225 (45 degrees away from 270)
    

    If you want the progress to go from other sides (Left to right, right to left etc..) you will only need to replace 270 with the starting the angle.

提交回复
热议问题