在 swift 中的矩形上绘制渐变

Question

我尝试在矩形中绘制渐变。下图显示，该渐变一般有效（蓝色），但它填满了整个屏幕。

我喜欢只在特定区域做渐变，比如绿色矩形。

我该怎么做？

我的梯度实验代码:-)

let context = UIGraphicsGetCurrentContext()

//let locations: [CGFloat] = [ 0.0, 0.25, 0.5, 0.75 ]
let locations: [CGFloat] = [ 0.0, 0.99 ]

let colors = [UIColor.blueColor().CGColor,
               UIColor.whiteColor().CGColor]

let colorspace = CGColorSpaceCreateDeviceRGB()

let gradient = CGGradientCreateWithColors(colorspace,
    colors, locations)

var startPoint = CGPoint()
var endPoint =  CGPoint()

startPoint.x = 0.0
startPoint.y = 10.0
endPoint.x = self.frame.width-100;
endPoint.y = 10

//let rectangle_main = CGRectMake(CGFloat(15), CGFloat(0), CGFloat(1000), CGFloat(30));

//CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0)
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0)

Answer 1

您需要在绘制渐变之前指定剪切路径。在您的情况下，创建一个矩形路径并调用 CGContextClip(context)

CGContextAddRect(context, CGRect(...))
CGContextClip(context)

CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0)

渐变将裁剪到矩形。

在 swift 中的矩形上绘制渐变

drawing gradient over rectangle in swift

gradient

draw

ios

swift