UIエレメントにCIFilterを適用する

Question

UIエレメントにCIFilterを適用したい。私はそれを.filtersメンバ経由でviewsレイヤーに適用しようとしました。しかし、フィルターは適用されません。

Answer 1

UIGraphicsGetImageFromCurrentImageContextを使用してUIImageを生成し、それにフィルタを適用して、元のコンポーネントにフィルタされた画像を含む画像ビューをオーバーレイします。ここで

は、ぼかし（taken from my blog）であることを行う方法です：

のUIViewのぼやけた表現を取得するには非常に単純です：私はにレンダリングするためにビューのレイヤーのrenderInContextメソッドを使用し、画像のコンテキストを開始する必要がありますその後、コンテキストおよびコンテキストからUIImageを取得：

UIGraphicsBeginImageContextWithOptions(CGSize(width: frame.width, height: frame.height), false, 1) 

layer.renderInContext(UIGraphicsGetCurrentContext()!) 

let image = UIGraphicsGetImageFromCurrentImageContext() 


UIGraphicsEndImageContext(); 

私は画像が取り込またら、それはそれにガウスぼかしを適用するにはかなり標準的なワークフローです：

guard let blur = CIFilter(name: "CIGaussianBlur") else 
{ 
    return 
} 

blur.setValue(CIImage(image: image), forKey: kCIInputImageKey) 
blur.setValue(blurRadius, forKey: kCIInputRadiusKey) 

let ciContext = CIContext(options: nil) 

let result = blur.valueForKey(kCIOutputImageKey) as! CIImage! 

let boundingRect = CGRect(x: -blurRadius * 4, 
    y: -blurRadius * 4, 
    width: frame.width + (blurRadius * 8), 
    height: frame.height + (blurRadius * 8)) 

let cgImage = ciContext.createCGImage(result, fromRect: boundingRect) 


let filteredImage = UIImage(CGImage: cgImage) 

ぼやけた画像は入力画像より大きくなりますので、私はcreateCGImageで必要なサイズについて明示する必要があります。

次の手順は、UIImageViewを追加して他のすべてのビューを非表示にすることです。それはそれを取り除くに来るとき、私は既存のUIImageViewを削除していないよ確認することができますように、私はBlurOverlayにUIImageViewをサブクラス化しました：

let blurOverlay = BlurOverlay() 
blurOverlay.frame = boundingRect 

blurOverlay.image = filteredImage 

subviews.forEach{ $0.hidden = true } 


addSubview(blurOverlay) 

それが解除ぼかしになると、私は最後のを確実にしたいです

：

func unBlur() 
{ 
    if let blurOverlay = subviews.last as? BlurOverlay 
    { 
     blurOverlay.removeFromSuperview() 

     subviews.forEach{ $0.hidden = false } 
    } 

} 

最後に、UIViewが現在ぼやけているかどうかを確認するために、私はちょうどその最後のサブビューがBlurOverlayであるかどうかを確認する必要があります。サブビューは私BlurOverlayそれを削除し、既存のビューを再表示の一つであります

var isBlurred: Bool 
{ 
    return subviews.last is BlurOverlay 
}