iPhone：画一条曲线直到它变成圆形动画 [英] iPhone: Drawing a curved line until it becomes a circle animation

问题描述

我希望画一条曲线，直到它完全旋转并连接成一个完整的圆，只是圆轮廓，而不是实线。这必须经过几秒钟的动画处理。

I wish to draw a curved line until it makes a full rotation and joins to become a complete circle, just the circle outline, not filled. This has to be animated over a number of seconds.

有人能指出我正确的方向吗？我已经问过一个类似的问题，但是我措词不正确，所以每个人都有

Can anyone point me in the right direction? I already asked a similar question to this but I worded it incorrectly so everyone had a hard time understanding what I meant and thus it got lost in the sea of questions.

非常感谢您的帮助

[edit]

我目前正在对UIView进行子类化，并覆盖drawRect。我找到了绘制实心圆的代码，但我只需要描边。

I'm currently sub-classing UIView and overriding drawRect. I found code to draw a filled circle but I only require the stroke.

- (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);
}

我更改了代码以删除所有填充引用，但现在它未绘制任何内容:(有任何想法吗？

I changed the code to remove all the fill references but now its not drawing anything :( any ideas?

- (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);
}

解决方案

对，我觉得自己像对了！问题是笔划颜色值未初始化，意味着正在绘制线条，但显然看不到它！！

Right I feel like a right dickhead! the problem was that the stroke colour values were not initialised meaning that line was being draw but obviously could not see it!!

推荐答案

删除所有显示填充的内容。

Take out everything that says Fill.

更改CGContextFillPath

Change the CGContextFillPath at the end to CGContextStrokePath.

在结尾处取出CGContextMoveToPoint和CGContextClosePath。那些只是勾勒出楔形的直边。

Take out the CGContextMoveToPoint and CGContextClosePath near the end. Those just outline the straight sides of the wedge.

您可能不得不更改CGContextMoveToPoint，以移动到弧的起点而不是中心，而不是取而代之

You might have to change the CGContextMoveToPoint to move to the start point of the arc instead of the center, instead of taking it out.

这篇关于iPhone：画一条曲线直到它变成圆形动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！