Blur effect using slider Is not working properly

Question

I have used a slider for blur effect to my image. I am using the following code:

let currentFilter = CIFilter(name: "CIGaussianBlur")
let beginImage = CIImage(image: imgImage.image!)

currentFilter!.setValue(beginImage, forKey: kCIInputImageKey)
currentFilter!.setValue(sender.value, forKey: kCIInputRadiusKey)

let cropFilter = CIFilter(name: "CICrop")

cropFilter!.setValue(currentFilter!.outputImage, forKey: kCIInputImageKey)
cropFilter!.setValue(CIVector(cgRect: beginImage!.extent), forKey: "inputRectangle")

let output = cropFilter!.outputImage
let cgimg = context.createCGImage(output!, from: output!.extent)
let processedImage = UIImage(cgImage: cgimg!)

imgImage.image = processedImage

The issue is whenever the slider's value is incremented the blur effect appears but when I decrease the value of the slider then it will not removing the blur effect.

Answer 1

You can apply the filter into your original image instead of already filtered image. Try below code.

    let context = CIContext(options: nil)

    @IBAction func blurSlider(_ sender: UISlider) {

    let originalImage = UIImage(named: "Your Image Name")
    let currentValue = Int(sender.value)

    let currentFilter = CIFilter(name: "CIGaussianBlur")
    currentFilter!.setValue(CIImage(image: originalImage!), forKey: kCIInputImageKey)
    currentFilter!.setValue(currentValue, forKey: kCIInputRadiusKey)

    let cropFilter = CIFilter(name: "CICrop")
    cropFilter!.setValue(currentFilter!.outputImage, forKey: kCIInputImageKey)
    cropFilter!.setValue(CIVector(cgRect: (CIImage(image: originalImage!)?.extent)!), forKey: "inputRectangle")

    let output = cropFilter!.outputImage
    let cgimg = context.createCGImage(output!, from: output!.extent)
    let processedImage = UIImage(cgImage: cgimg!)
    imgImage.image = processedImage

    }

Output from Simulator:

Note: I recommend you to test the code in real device as Simulator performance is too slow on coreImage.

Answer 2

Make separate class which adds the blur effect:

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())
    }
}
}

How to use :

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
}
}