CGGradient和路径剪辑：剪辑周围的奇怪边框

我想重现书中的一个例子iOS编程：大Nerd牧场指南第4版。CGGradient和路径剪辑：剪辑周围的奇怪边框

请注意，我在Swift中重写了本书中的所有Obj-C代码。

是一个挑战，这本书需要绘制这个三角形梯度，采用核芯显卡：

enter image description here

但是当我运行我的代码，我注意到一个豆蔻灰色边框包围的三角形：

enter image description here

我不明白为什么....这是我的代码：

.... 
    // draw circles 
    UIColor.grayColor().setStroke() 
    path.stroke() 

    let logoImg = UIImage(named: "logo.png") 
    let realSize:CGSize = logoImg.size.halve() // get a /2 CGSize in order to calculate non-retina size 

    let gradientLocations:[CGFloat] = [0, 1] 
    let gradientColors:[CGFloat] = [0, 1, 0, 1, 
            1, 1, 0, 1] 
    let colorSpace = CGColorSpaceCreateDeviceRGB() 
    let gradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, gradientLocations, 2) 

    let gradientClipPath = UIBezierPath() 
    gradientClipPath.moveToPoint(CGPoint(x: center.x - realSize.width/2, y: center.y + realSize.height/2 + 30)) 
    gradientClipPath.addLineToPoint(CGPoint(x: center.x + realSize.width/2, y: center.y + realSize.height/2 + 30)) 
    gradientClipPath.addLineToPoint(CGPoint(x: center.x, y: center.y - realSize.height/2 - 30)) 
    gradientClipPath.addLineToPoint(CGPoint(x: center.x - realSize.width/2, y: center.y + realSize.height/2 + 30)) 
    gradientClipPath.fill() 

    // draw gradient 
    CGContextSaveGState(currContext) 
    gradientClipPath.addClip() 
    CGContextDrawLinearGradient(currContext, gradient, CGPoint(x: 0, y: center.y - realSize.height/2 - 30), CGPoint(x: 0, y: center.y + realSize.height/2 + 30), 0) 
    CGContextRestoreGState(currContext) 

    // draw logo with drop shadow 
    ....

设定行程清除或其他颜色没有效果。边框仍然存在，它仍然是灰色的。

来源

2014-10-10 Teejay

'gradientClipPath.fill（）'是否意味着在代码中？我认为这是一个错误。如果不是这样，我无法真正帮助对不起，现在我总是使用'CAShapeLayer'，并且在Core Graphics中练习过。注意：你真的应该避免在真实世界的项目中使用核心图形。通常'CAShapeLayer'对于绘制贝塞尔路径更好。 – 2014-10-10 03:06:46

我认为'fill（）'应该在那里，因为它会触及渐变将被绘制的区域...不是？请注意，这是本书中的一个挑战，所以我自己写了部分代码。感谢您提供关于CG的建议。 – Teejay 2014-10-10 08:14:14

尝试填写，我认为这是错误的部分。如果你不填满它有帮助吗？ – 2014-10-10 10:03:21

在绘制渐变之前，不需要填充渐变路径。删除此行：

gradientClipPath.fill()

来源

2014-10-12 00:58:50

CGGradient和路径剪辑：剪辑周围的奇怪边框

回答

相关问题