自定义控件上从左上角出现的 iOS 图形

Question

我一直在做一个圆形控件，我做的很好，除了当我第一次做渲染时图形从左上角出现。

整个控件是 UIControl 的子类，带有自定义的 CALayer，它可以渲染一个圆。

这是呈现圆圈的代码:

- (void) drawInContext:(CGContextRef)ctx{
id modelLayer = [self modelLayer];
CGFloat radius = [[modelLayer valueForKey:DXCircularControlLayerPropertyNameRadius] floatValue];
CGFloat lineWidth = [[modelLayer valueForKey:DXCircularControlLayerPropertyNameLineWidth] floatValue];
//NSLog(@"%s, angle: %6.2f, radius: %6.2f, angle_m: %6.2f, radius_m: %6.2f", __func__, self.circleAngle, self.circleRadius, [[modelLayer valueForKey:@"circleAngle"] floatValue], [[modelLayer valueForKey:@"circleRadius"] floatValue]);

// draw circle arc up to target angle

CGRect frame = self.frame;
CGContextRef context = ctx;

CGContextSetShouldAntialias(context, YES);
CGContextSetAllowsAntialiasing(context, YES);

// draw thin circle

//CGContextSetLineWidth(context, <#CGFloat width#>)

// draw selection circle

CGContextSetLineWidth(context, lineWidth);
CGContextSetStrokeColorWithColor(context, [UIColor greenColor].CGColor);
CGContextAddArc(context, frame.size.width / 2.0f, frame.size.height / 2.0f, radius, 0.0f, self.circleAngle, 0);

CGContextStrokePath(context);

CGContextSetShouldAntialias(context, NO);
}

这是 video的问题。

如果你仔细观察，你会发现圆圈的渲染不知为何没有开始居中。它从左上角倾斜。 这只会在第一次制作动画时发生。

我知道如果动画提交 block 开始和结束时出现错误，就会发生这种情况，但我不会在这里使用它们。

为了以防万一这里是 bitbucket 的链接 repo这个控件的:

Answer 1

绘制方法没有问题 - 你在设置图层框架时搞砸了一点;-)

您正在您的 - (void) setAngle:(CGFloat)angle 方法中设置 circularControlLayer 的框架。这意味着当您为 angle 属性设置动画时，框架是第一次设置 - 所以框架也会被动画化。在 - (void) commonInitDXCircularControlView 方法中设置框架。

如果您要创建自定义图层，请查看 [UIView layerClass] 方法。使用它将使您免于边界/框架管理的麻烦。