iOS使用CGContext绘制线条的质量比SpriteKit中的SKShapeNode差很多

时间:2022-04-05 17:22:12

I'm making a game where the user can draw lines with finger. There are tons of methods on websites. I tried two methods, one using CGContext in UIView (UIKit), and the other using CGPath and SKShapeNode in SpriteKit. But the latter shows much better quality. The first one using CGContext has ugly rough edges.

我正在制作一个用户可以用手指画线的游戏。网站上有很多方法。我尝试了两种方法,一种在UIView(UIKit)中使用CGContext,另一种在SpriteKit中使用CGPath和SKShapeNode。但后者显示出更好的质量。使用CGContext的第一个具有难看的粗糙边缘。

Please see following screen shots. I also attached part of code for both methods here, (in the touchesMove function).

请参阅以下屏幕截图。我还在这里为这两种方法附加了部分代码(在touchesMove函数中)。

Note: var ref = CGPathCreateMutable()

注意:var ref = CGPathCreateMutable()

CGContext in UIView iOS使用CGContext绘制线条的质量比SpriteKit中的SKShapeNode差很多

UIView中的CGContext

    CGPathAddLineToPoint(ref, nil, currentPoint.x, currentPoint.y)

    UIGraphicsBeginImageContext(self.frame.size)
    let context = UIGraphicsGetCurrentContext()
    tempImageView.image?.drawInRect(CGRect(x: 0, y: 0, width: self.frame.size.width, height: self.frame.size.height))


    CGContextAddPath(context, ref)

    // 3
    CGContextSetLineCap(context, CGLineCap.Round)
    CGContextSetLineWidth(context, brushWidth)
    CGContextSetRGBStrokeColor(context, red, green, blue, 1.0)
    CGContextSetBlendMode(context, CGBlendMode.Normal)

    // 4
    CGContextStrokePath(context)

    // 5
    UIGraphicsEndImageContext()

SKShapeNode in SpriteKit iOS使用CGContext绘制线条的质量比SpriteKit中的SKShapeNode差很多 Note: var lineDrawing = SKShapeNode()

SpriteKit中的SKShapeNode注意:var lineDrawing = SKShapeNode()

CGPathAddLineToPoint(ref, nil, location.x, location.y)
lineDrawing.path = ref
lineDrawing.lineWidth = 3
lineDrawing.strokeColor = UIColor.blackColor()
lineDrawing.alpha = 1.0
self.addChild(lineDrawing)

How can I draw lines in UIView with the same quality of SKShapeNode?

如何在UIView中使用相同质量的SKShapeNode绘制线条?

1 个解决方案

#1


1  

One obvious problem is that you're using an outdated function that doesn't handle Retina screens:

一个明显的问题是你使用的是一个不能处理Retina屏幕的过时功能:

UIGraphicsBeginImageContext(self.frame.size)

You should be using this instead:

您应该使用此代替:

UIGraphicsBeginImageContextWithOptions(self.frame.size, false, 0)

The WithOptions version, with 0 as the final argument, creates an image context at Retina resolution if the device has a Retina screen. (The 0 argument means “use the device screen's scale factor”.)

如果设备具有Retina屏幕,则WithOptions版本(以0作为最终参数)在Retina分辨率下创建图像上下文。 (0参数表示“使用设备屏幕的比例因子”。)

There may be other issues, because you didn't show the code that creates the points in the path for each test case.

可能还有其他问题,因为您没有显示在每个测试用例的路径中创建点的代码。

#1


1  

One obvious problem is that you're using an outdated function that doesn't handle Retina screens:

一个明显的问题是你使用的是一个不能处理Retina屏幕的过时功能:

UIGraphicsBeginImageContext(self.frame.size)

You should be using this instead:

您应该使用此代替:

UIGraphicsBeginImageContextWithOptions(self.frame.size, false, 0)

The WithOptions version, with 0 as the final argument, creates an image context at Retina resolution if the device has a Retina screen. (The 0 argument means “use the device screen's scale factor”.)

如果设备具有Retina屏幕,则WithOptions版本(以0作为最终参数)在Retina分辨率下创建图像上下文。 (0参数表示“使用设备屏幕的比例因子”。)

There may be other issues, because you didn't show the code that creates the points in the path for each test case.

可能还有其他问题,因为您没有显示在每个测试用例的路径中创建点的代码。