Swift - GLKit View CIFilter Image

Question

I am trying to use a GLIKit View in order to modify an Image. The class I have so far is working well all the CIFilters except for the CILineOverlay it renders a black view. If I use any other effect it works well.

Why is the CILineOverlay not showing?

class ImageView: GLKView {
    let clampFilter = CIFilter(name: "CIAffineClamp")!
    let blurFilter = CIFilter(name: "CILineOverlay")!
    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: "inputIntensity")
            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)
        }
    }
}

score 5 · Answer 1 · answered Jun 17 '16 at 23:59

The Apple docs states "The portions of the image that are not outlined are transparent." - this means you are drawing black lines over a black background. You can simply composite the output from the filter over a white background to make the lines appear:

    let background = CIImage(color: CIColor(color: UIColor.whiteColor()))
        .imageByCroppingToRect(inputCIImage.extent)

    let finalImage = filter.outputImage!
        .imageByCompositingOverImage(background)

So obvious but at the same time not. Thanks very much! – StuartM Nov 22 '17 at 20:55 — StuartM, Nov 22 '17 at 20:55

Swift - GLKit View CIFilter Image

1 Answers1