iPhone: рисование кривой линии, пока она не станет круговой анимацией

Question

Я хочу нарисовать изогнутую линию, пока она не совершит полный оборот и не станет полным кругом, просто контур круга, не заполненный.Это должно быть оживлено в течение нескольких секунд.

Кто-нибудь может указать мне правильное направление?Я уже задавал подобный вопрос на этот вопрос, но я сформулировал его неправильно, поэтому всем было трудно понять, что я имел в виду, и поэтому он потерялся в море вопросов.

Большое спасибо за любыеhelp

[edit]

В настоящее время я делю UIView на подкласс и переопределяю drawRect.Я нашел код для рисования закрашенного круга, но мне требуется только обводка.

- (void)drawRect:(CGRect)rect {
// Drawing code

CGRect allRect = self.bounds;
CGRect circleRect = CGRectInset(allRect, 2.0f, 2.0f);

CGContextRef context = UIGraphicsGetCurrentContext();

// Draw background
CGContextSetRGBStrokeColor(context, self.strokeValueRed, self.strokeValueGreen, self.strokeValueBlue, self.strokeValueAlpha); // white
CGContextSetRGBFillColor(context, 1.0f, 1.0f, 1.0f, 0.1f); // translucent white
CGContextSetLineWidth(context, self.lineWidth);
CGContextFillEllipseInRect(context, circleRect);
CGContextStrokeEllipseInRect(context, circleRect);

// Draw progress
CGPoint center = CGPointMake(allRect.size.width / 2, allRect.size.height / 2);
CGFloat radius = (allRect.size.width - 4) / 2;
CGFloat startAngle = - ((float)M_PI / 2); // 90 degrees
CGFloat endAngle = (self.progress * 2 * (float)M_PI) + startAngle;
CGContextSetRGBFillColor(context, 1.0f, 1.0f, 1.0f, 1.0f); // white
CGContextMoveToPoint(context, center.x, center.y);
CGContextAddArc(context, center.x, center.y, radius, startAngle, endAngle, 0);
CGContextClosePath(context);
CGContextFillPath(context);
}

[edit # 2]

Я изменил код, чтобы удалить все ссылки на заливки, но теперь он не рисуетсячто-нибудь :( есть идеи?

- (void)drawRect:(CGRect)rect
{
// Drawing code

CGRect allRect = self.bounds;
CGContextRef context = UIGraphicsGetCurrentContext();

// Draw background
CGContextSetRGBStrokeColor(context, self.strokeValueRed, self.strokeValueGreen, self.strokeValueBlue, self.strokeValueAlpha); // white
CGContextSetLineWidth(context, 5);

// Draw progress
CGPoint center = CGPointMake(allRect.size.width / 2, allRect.size.height / 2);
CGFloat radius = (allRect.size.width - 4) / 2;
CGFloat startAngle = - ((float)M_PI / 2); // 90 degrees
CGFloat endAngle = (self.progress * 2 * (float)M_PI) + startAngle;
CGContextAddArc(context, center.x, center.y, radius, startAngle, endAngle, 0);
CGContextStrokePath(context);
}

[edit # 3] Решение

Правильно, я чувствую себя как правый придурок! Проблема заключалась в том, что значения цвета обводки не были инициализированы, означая, что линия былабудучи ничьей, но, очевидно, не мог видеть это !!

Answer 1

Это тот же ответ, который я дал на ваш другой вопрос здесь .

Что вы действительно должны сделать, это анимировать штрих CAShapeLayer , где путь представляет собой круг. Это будет ускорено с помощью Core Animation и будет менее грязным, чем рисование части круга в -drawRect:.

Код ниже создаст слой в форме круга в центре экрана и анимирует его обводку по часовой стрелке так, чтобы он выглядел так, как будто он рисуется. Конечно, вы можете использовать любую фигуру, какую захотите. (Вы можете прочитать эту статью в блоге Ole Begemanns, чтобы узнать больше о том, как анимировать обводку слоя формы.)

Примечание: , что свойства сток не совпадают со свойствами границы на слое. Чтобы изменить ширину обводки, вы должны использовать «lineWidth» вместо «borderWitdh» и т. Д.

// Set up the shape of the circle
int radius = 100;
CAShapeLayer *circle = [CAShapeLayer layer];
// Make a circular shape
circle.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) 
                                         cornerRadius:radius].CGPath;
// Center the shape in self.view
circle.position = CGPointMake(CGRectGetMidX(self.view.frame)-radius, 
                              CGRectGetMidY(self.view.frame)-radius);

// Configure the apperence of the circle
circle.fillColor = [UIColor clearColor].CGColor;
circle.strokeColor = [UIColor blackColor].CGColor;
circle.lineWidth = 5;

// Add to parent layer
[self.view.layer addSublayer:circle];

// Configure animation
CABasicAnimation *drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
drawAnimation.duration            = 10.0; // "animate over 10 seconds or so.."
drawAnimation.repeatCount         = 1.0;  // Animate only once..

// Animate from no part of the stroke being drawn to the entire stroke being drawn
drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
drawAnimation.toValue   = [NSNumber numberWithFloat:1.0f];

// Experiment with timing to get the appearence to look the way you want
drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

// Add the animation to the circle
[circle addAnimation:drawAnimation forKey:@"drawCircleAnimation"];

Answer 2

Уберите все, что говорит Fill.

Измените CGContextFillPath в конце на CGContextStrokePath.

Извлеките CGContextMoveToPoint и CGContextClosePath в конце.Они просто очерчивают прямые стороны клина.

Возможно, вам придется изменить CGContextMoveToPoint, чтобы переместиться в начальную точку дуги вместо центра, вместо того, чтобы вынимать его.

Answer 3

Очень прямолинейный подход может заключаться в том, чтобы создать подкласс UIView и нарисовать дугу переменной длины.Затем вы можете использовать таймер для периодического обновления угла поворота