Question

如何在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的模糊。

谢谢！

Answer 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及其示例代码。

Answer 2

- (UIImage *)blurWithCoreImage:(UIImage *)sourceImage
{
    CIImage *inputImage = [CIImage imageWithCGImage:sourceImage.CGImage];

    // Apply Affine-Clamp filter to stretch the image so that it does not
    // look shrunken when gaussian blur is applied
    CGAffineTransform transform = CGAffineTransformIdentity;
    CIFilter *clampFilter = [CIFilter filterWithName:@"CIAffineClamp"];
    [clampFilter setValue:inputImage forKey:@"inputImage"];
    [clampFilter setValue:[NSValue valueWithBytes:&transform objCType:@encode(CGAffineTransform)] forKey:@"inputTransform"];

    // Apply gaussian blur filter with radius of 30
    CIFilter *gaussianBlurFilter = [CIFilter filterWithName: @"CIGaussianBlur"];
    [gaussianBlurFilter setValue:clampFilter.outputImage forKey: @"inputImage"];
    [gaussianBlurFilter setValue:@30 forKey:@"inputRadius"];

    CIContext *context = [CIContext contextWithOptions:nil];
    CGImageRef cgImage = [context createCGImage:gaussianBlurFilter.outputImage fromRect:[inputImage extent]];

    // Set up output context.
    UIGraphicsBeginImageContext(self.view.frame.size);
    CGContextRef outputContext = UIGraphicsGetCurrentContext();

    // Invert image coordinates
    CGContextScaleCTM(outputContext, 1.0, -1.0);
    CGContextTranslateCTM(outputContext, 0, -self.view.frame.size.height);

    // Draw base image.
    CGContextDrawImage(outputContext, self.view.frame, cgImage);

    // Apply white tint
    CGContextSaveGState(outputContext);
    CGContextSetFillColorWithColor(outputContext, [UIColor colorWithWhite:1 alpha:0.2].CGColor);
    CGContextFillRect(outputContext, self.view.frame);
    CGContextRestoreGState(outputContext);

    // Output image is ready.
    UIImage *outputImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return outputImage;
}

使用上面的代码可以模糊图像。希望它会有所帮助。

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

2 个答案: