通过 CGContext 绘制 UIButton 图像

Posted

技术标签:

【中文标题】通过 CGContext 绘制 UIButton 图像【英文标题】:Drawing UIButton image via CGContext 【发布时间】:2018-06-11 19:06:24 【问题描述】:

为了在按钮上显示进度圈,我在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];

为什么我得到一个实心正方形而不是一个实心的部分圆弧?这是将进度条画成圆形的最佳方式吗?

【问题讨论】:

【参考方案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 图像的主要内容,如果未能解决你的问题,请参考以下文章

使用 CGContext 绘制后擦除

在 iOS7 中使用 CGContext 绘制问题

如何检查 CGContext 是不是包含点?

如何使用 CGContext 模糊线条的边缘

填充 CGContext 的其余部分,保持一个矩形透明

iPhone App - 为啥我的 CGContext 圆圈看起来像黑色方块?