Skity icon indicating copy to clipboard operation
Skity copied to clipboard

how to draw arc progressive?

Open CaichaoGitHub opened this issue 3 years ago • 4 comments

hi, thanks you great work on skity

as the code blew , i want to draw arc by path from 0 degrees to 360 degrees, but it's not working , any suggestions ?

截屏2022-10-15 18 51 08

CaichaoGitHub avatar Oct 15 '22 10:10 CaichaoGitHub

Hi @CaichaoGitHub , thanks for reporting this. And I think this is a mistake in skity, I will fix this when I have time. And there is another way to do this by using Path::arcTo(float rx, float ry, float xAxisRotate, ArcSize largeArc, Direction sweep, float x, float y) with some matrix calculations. And I put the code snippets here:


// assume the circle is at {50, 50} with 50 radius
skity::Rect rect = skity::Rect::MakeXYWH(0, 0, 100, 100);
float rx = 50.f;
float ry = 50.f;

// calculate end position by rotate and translate
glm::mat4 matrix = glm::rotate(glm::mat4(1.f), glm::radians(360 * progress),
                                   glm::vec3(0.f, 0.f, 1.f));
glm::vec4 p = matrix * glm::vec4(rx, 0.f, 0.f, 1.f);
p += glm::vec4(rx, ry, 0.f, 0.f);

// circle start ad left most point of this circle
skity::Path path;
path.moveTo(rx * 2.f, ry);
path.arcTo(rx, ry, 360 * progress,
               progress > 0.5f ? skity::Path::ArcSize::kLarge
                               : skity::Path::ArcSize::kSmall,
               skity::Path::Direction::kCW, p.x, p.y);

canvas->drawPath(path, paint);

Let me know, if this not working in your case.

RuiwenTang avatar Oct 15 '22 15:10 RuiwenTang

hi @RuiwenTang good solutions, it works thanks very much

CaichaoGitHub avatar Oct 17 '22 03:10 CaichaoGitHub

@RuiwenTang maybe there is a edge problem, after the sweenAngle is 360 , the position is incorrect,i fix by limit max progress to 0.99 image

CaichaoGitHub avatar Oct 17 '22 06:10 CaichaoGitHub

Ok, I will take a look

RuiwenTang avatar Oct 17 '22 07:10 RuiwenTang