将渐变效果应用于模糊视图

如何在Swift中添加具有模糊效果的渐变视图? 我可以很容易地为视图添加渐变图层(CAGradientLayer)。 我还可以单独添加模糊视图(UIVisualEffectView)。

如何将两者结合起来创建一个模糊视图,该视图还具有渐变元素,其中完全模糊渐渐消失为无模糊?

类似效果的一个例子:

我正在寻找的例子

如果您了解CoreImage ,则可以轻松地将两个filter链接在一起,一个来自CICategoryBlur,另一个来自CICategoryGradient。

这是一个使用示例。 要链,只需将第一个filter的输出作为下一个的输入:

func convertImageToBW(image:UIImage) -> UIImage { let filter = CIFilter(name: "CIPhotoEffectMono") // convert UIImage to CIImage and set as input let ciInput = CIImage(image: image) filter?.setValue(ciInput, forKey: "inputImage") // get output CIImage, render as CGImage first to retain proper UIImage scale let ciOutput = filter?.outputImage let ciContext = CIContext() let cgImage = ciContext.createCGImage(ciOutput!, from: (ciOutput?.extent)!) return UIImage(cgImage: cgImage!) } 

上面的链接是Apple文档。

要获得具有渐变模糊半径的模糊视图,您可以执行以下操作( 根据Apple文档 ):

 let ciContext = CIContext(options: nil) if let inputImage = CIImage(image: yourUIImage) { let extent = inputImage.extent let h = extent.size.height guard let gradient = CIFilter(name: "CILinearGradient") else { return } gradient.setValue(CIVector(x: 0, y: 0.85 * h), forKey: "inputPoint0") gradient.setValue(CIColor.green, forKey: "inputColor0") gradient.setValue(CIVector(x: 0, y: 0.50 * h), forKey: "inputPoint1") gradient.setValue(CIColor(red: 0, green: 1, blue: 0, alpha: 0), forKey: "inputColor1") guard let mask = CIFilter(name: "CIMaskedVariableBlur") else { return } mask.setValue(inputImage.clampedToExtent(), forKey: kCIInputImageKey) // Set your blur radius here, default is 5 mask.setValue(10, forKey: kCIInputRadiusKey) mask.setValue(gradient.outputImage, forKey: "inputMask") guard let output = mask.outputImage, let cgImage = ciContext.createCGImage(output, from: extent) else { return } outUIImage = UIImage(cgImage: cgImage) } 

这里, inputPoint0是渐变渐变的起点, inputPoint1是结束点。 请注意,对于CIVector y从底部到顶部增加。 您设置的输入颜色无关紧要,只有其alpha用于确定模糊半径。

关于动态地将CIFilter应用于其下面的图像的第二个问题,不,这是不可能的。 有关backgroundFilters的Apple文档可能会让您认为它是可行的,直到您在底部看到…

iOS中的图层不支持此属性。

您应该做的是,每当您重置图像时,将上述操作应用于该图像并将其设置为图像视图。