核心图形 - 使用CGGradient与笔画和文本

时间:2016-07-23 08:10:40

标签: ios swift core-graphics gradient

所以这是我创建特定渐变的代码:

     let newBlueOne = UIColor(red: 0.141, green: 0.776, blue: 0.863,     alpha: 1.000)
    let newBlueTwo = UIColor(red: 0.318, green: 0.290, blue: 0.616, alpha: 1.000)

以下是渐变本身的代码:

let newBlue = CGGradientCreateWithColors(CGColorSpaceCreateDeviceRGB(), [newBlue1.CGColor, newBlue2.CGColor], [0, 1])!

以下是我试图制作的矩形的代码:

      let rectanglePath = UIBezierPath(roundedRect: CGRect(x: 22, y: 35, width: 194, height: 38), cornerRadius: 19)
    CGContextSaveGState(context)
    rectanglePath.addClip()
    CGContextDrawLinearGradient(context, translucent1, CGPoint(x: 119, y: 35), CGPoint(x: 119, y: 73), CGGradientDrawingOptions())
    CGContextRestoreGState(context)
    rectanglePath.lineWidth = 1
    rectanglePath.stroke()

我想使用上面的newBlue渐变作为创建此矩形的笔触颜色。我还想将一些文本的颜色更改为newBlue渐变。不幸的是,我无法弄明白。有人可以帮忙吗?

感谢您的回复并期待阅读。非常感谢你:))

1 个答案:

答案 0 :(得分:2)

您无法使用渐变直接描边路径。

要做你想做的事,你需要进入核心图形层,并使用CGContext函数。

首先,创建路径,并设置其各种属性,例如线宽。

然后,使用CGContextReplacePathWithStrokedPath(context)函数。在CGContext文档中查找。

然后,将结果路径用作剪辑路径。

然后,用渐变绘制该区域。

喜欢这个:

override  func  drawRect(rect: CGRect) {
    let newBlueOne = UIColor(red: 0.141, green: 0.776, blue: 0.863, alpha: 1.000)
    let newBlueTwo = UIColor(red: 0.318, green: 0.290, blue: 0.616, alpha: 1.000)
    let newBlue = CGGradientCreateWithColors(CGColorSpaceCreateDeviceRGB(), [newBlueOne.CGColor, newBlueTwo.CGColor], [0, 1])!

    let  lineWeight: CGFloat = 20.0

    let  context: CGContext = UIGraphicsGetCurrentContext()!

    let  rect: CGRect = CGRectMake(40.0, 40.0, 200.0, 200.0)
    CGContextAddRect(context, rect)
    CGContextSetLineWidth(context, lineWeight)
    CGContextReplacePathWithStrokedPath(context)
    CGContextClip(context)

    let  startPoint: CGPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMinY(rect))
    let  endPoint: CGPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMaxY(rect))
    CGContextDrawLinearGradient(context, newBlue, startPoint, endPoint, CGGradientDrawingOptions(rawValue: 0))
}

我只是在画边界。我不知道文字。