通过 CGContext 绘制 UIButton 图片

Question

为了在按钮上显示进度圈，我画了一个圆弧成CGContext，然后传给UIImage，最后传给UIButton图像。然而，它绘制的只是一个填充的正方形：

CGRect rect = CGRectMake(0, 0, myButton.frame.size.width, myButton.frame.size.height);

UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(ctx, 1);
[[UIColor colorWithRed:1.0 green:0. blue:0. alpha:1.0] setStroke];
[[UIColor colorWithWhite:0.9 alpha:1.0] setFill];
CGContextMoveToPoint(ctx, rect.size.width/2., rect.size.height/2.);
CGContextAddArc(ctx,
                rect.size.width/2., // centerX
                rect.size.height/2.,  // centerY
                rect.size.width, // radius
                0, // start Angle
                M_PI/2., // end Angle
                1); // clockwise
CGContextDrawPath(ctx,kCGPathFillStroke);

UIImage *progressImg=UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[myButton setImage:progressImg forState:UIControlStateNormal];

为什么我得到的是实心方形而不是实心部分圆弧？这是将进度条绘制为圆圈的最佳方式吗？

Answer 1

你的圆弧半径不对。实际弧线是在您的上下文范围之外绘制的。变化

CGContextAddArc(ctx,
                rect.size.width/2., // centerX
                rect.size.height/2.,  // centerY
                rect.size.width, // radius
                0, // start Angle
                M_PI/2., // end Angle
                1); // clockwise

至

CGContextAddArc(ctx,
                rect.size.width/2., // centerX
                rect.size.height/2.,  // centerY
                rect.size.width/2., // radius
                0, // start Angle
                M_PI/2., // end Angle
                1); // clockwise

另外请注意，根据您的按钮类型，您最终可能会将图像视为模板而不是您绘制的实际图像。要解决这个问题，您会说（在使用按钮中的图像之前）：

progressImg = 
    [progressImg imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

通过 CGContext 绘制 UIButton 图片

Drawing UIButton image via CGContext

core-graphics

objective-c

uibutton

cgcontext

ios