在 iOS 上通过滑动实现 UIImage 的实时模糊

Posted 2023-03-13

【中文标题】在 iOS 上通过滑动实现 UIImage 的实时模糊

【英文标题】：Real-time blur for UIImage by sliding on iOS

【发布时间】：2015-09-02 13:46:29

【问题描述】：

如何在sliderValueChanged(_:)上实现UIImage的实时模糊？

@IBOutlet weak var imageView: UIImageView!

@IBAction func sliderValueChanged(sender: UISlider) 
    let blurRadius = sender.value
    var img = imageView.image

    // some image processing for img

    //blurring for img

    // some another image processing for img

    imageView.image = img   

由于存在其他图像处理，我不适合 UIImageView 的模糊。

谢谢！

【问题讨论】：

github.com/cyndibaby905/TwitterCover

@nathanwhy 不幸的是，TwitterCover 仅适用于 UIViews，不适用于 UIImages

【参考方案1】：

为了获得最佳性能，您应该使用GLKView 和CIFilter 而不是UIImageView。

最简单的实现之一是这样的（Xcode6/Swift1.2）：

import UIKit
import GLKit

class BlurImageView: GLKView 
    let clampFilter = CIFilter(name: "CIAffineClamp")!
    let blurFilter = CIFilter(name: "CIGaussianBlur")!
    let ciContext:CIContext

    override init(frame: CGRect) 
        let glContext = EAGLContext(API: .OpenGLES2)
        ciContext = CIContext(
            EAGLContext: glContext,
            options: [
                kCIContextWorkingColorSpace: NSNull()
            ]
        )
        super.init(frame: frame, context: glContext)
        enableSetNeedsDisplay = true
    

    required init(coder aDecoder: NSCoder) 
        let glContext = EAGLContext(API: .OpenGLES2)
        ciContext = CIContext(
            EAGLContext: glContext,
            options: [
                kCIContextWorkingColorSpace: NSNull()
            ]
        )
        super.init(coder: aDecoder)
        context = glContext
        enableSetNeedsDisplay = true
    

    @IBInspectable var inputImage: UIImage? 
        didSet 
            inputCIImage = inputImage.map  CIImage(image: $0)! 
        
    

    @IBInspectable var blurRadius: Float = 0 
        didSet 
            blurFilter.setValue(blurRadius, forKey: "inputRadius")
            setNeedsDisplay()
        
    

    var inputCIImage: CIImage? 
        didSet  setNeedsDisplay() 
    

    override func drawRect(rect: CGRect) 
        if let inputCIImage = inputCIImage 
            clampFilter.setValue(inputCIImage, forKey: kCIInputImageKey)
            blurFilter.setValue(clampFilter.outputImage!, forKey: kCIInputImageKey)
            let rect = CGRect(x: 0, y: 0, width: drawableWidth, height: drawableHeight)
            ciContext.drawImage(blurFilter.outputImage!, inRect: rect, fromRect: inputCIImage.extent())
        
    

然后，你可以这样使用：

class ViewController: UIViewController 

    @IBOutlet var imageView: BlurImageView!

    override func viewDidLoad() 
        super.viewDidLoad()
        imageView.inputImage = UIImage(named:"testImage")!
    

    @IBAction func sliderValueChanged(sender: UISlider) 
        imageView.blurRadius = sender.value
    

请参阅An Introduction to Core Image - objc.io，它是示例代码以获得更多解释和示例。

【讨论】：

感谢您的反馈！但我在网上遇到错误 (imageView.inputImage = ...) "EXC_BAD_ACCESS(code = 1, address = 0x0)。我应该如何正确初始化 imageView？

这里是示例项目文件:) dropbox.com/s/kptb5sbz75fcgcx/CITest.zip?dl=0

嗨 Rintaro，感谢您的出色回答。一个快速的问题 - 是否可以快速生成 UIImage 而不是 CIImage/CGImage 的结果？我的意思是不必在每次渲染时都转换它。最佳性能场景

我需要在我的照片编辑应用程序中使用此操作所以我需要使用 UIImageView ，有没有其他方法可以在 ImageView 上使用模糊效果？ @rintaro