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

iOS graphics appearing from upper left corner on custom control

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

整个控件是 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一道题。

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

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

以防万一这里是这个控件的位桶 repo 的 link:

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

您正在 - (void) setAngle:(CGFloat)angle 方法中设置 circularControlLayer 的框架。这意味着当您设置角度 属性 的动画时,框架是第一次设置 - 因此框架也会被设置动画。在 - (void) commonInitDXCircularControlView 方法中设置框架。

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