快速增加背景模糊效果

我正在设置一个背景图像，以查看控制器。但是我也想添加模糊效果到这个背景。我怎么能这么做？

我用以下代码设置背景:

self.view.backgroundColor = UIColor(patternImage: UIImage(named: "testBg")!)

我在互联网上找到的模糊图像查看如何实现这一点，我的背景？

var darkBlur = UIBlurEffect(style: UIBlurEffectStyle.Dark)
// 2
var blurView = UIVisualEffectView(effect: darkBlur)
blurView.frame = imageView.bounds
// 3
imageView.addSubview(blurView)
202226 次浏览
小开
最佳答案

我已经测试了这个代码，它运行良好:

let blurEffect = UIBlurEffect(style: UIBlurEffect.Style.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(blurEffectView)

对于 Swift 3.0:

let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(blurEffectView)

对于 Swift 4.0:

let blurEffect = UIBlurEffect(style: UIBlurEffect.Style.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(blurEffectView)

这里你可以看到结果:

blurred view

或者你可以使用这个 lib:

Https://github.com/flexmonkey/blurable

小开

可以对 UIImageView 进行扩展。

Swift 2.0

import Foundation
import UIKit


extension UIImageView
{
func makeBlurImage(targetImageView:UIImageView?)
{
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = targetImageView!.bounds


blurEffectView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight] // for supporting device rotation
targetImageView?.addSubview(blurEffectView)
}
}

用法:

override func viewDidLoad()
{
super.viewDidLoad()


let sampleImageView = UIImageView(frame: CGRectMake(0, 200, 300, 325))
let sampleImage:UIImage = UIImage(named: "ic_120x120")!
sampleImageView.image =  sampleImage


//Convert To Blur Image Here
sampleImageView.makeBlurImage(sampleImageView)


self.view.addSubview(sampleImageView)
}

斯威夫特3号分机

import Foundation
import UIKit


extension UIImageView
{
func addBlurEffect()
{
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.bounds


blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight] // for supporting device rotation
self.addSubview(blurEffectView)
}
}

用法:

yourImageView.addBlurEffect()

附录:

extension UIView {
  

/// Remove UIBlurEffect from UIView
func removeBlurEffect() {
let blurredEffectViews = self.subviews.filter{$0 is UIVisualEffectView}
blurredEffectViews.forEach{ blurView in
blurView.removeFromSuperview()
}
}

Swift 5.0:

import UIKit




extension UIImageView {
func applyBlurEffect() {
let blurEffect = UIBlurEffect(style: .light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
addSubview(blurEffectView)
}
}
小开

@ AlvinGeorge 应该使用:

extension UIImageView{
func blurImage()
{
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.bounds


blurEffectView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight] // for supporting device rotation
self.addSubview(blurEffectView)
}
}

用法 :

 blurredBackground.frame = self.view.bounds
blurredBackground.blurImage()
self.view.addSubview(self.blurredBackground)
小开

你也可以使用 CoreImage 来创建具有黑暗效果的模糊图像

  1. 为图像制作快照

    func snapShotImage() -> UIImage {
UIGraphicsBeginImageContext(self.frame.size)
if let context = UIGraphicsGetCurrentContext() {
self.layer.renderInContext(context)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return image
}


return UIImage()
}

  2. Apply CoreImage Filters as u wish with 

    private func bluredImage(view:UIView, radius:CGFloat = 1) -> UIImage {
let image = view.snapShotImage()


if let source = image.CGImage {
let context = CIContext(options: nil)
let inputImage = CIImage(CGImage: source)


let clampFilter = CIFilter(name: "CIAffineClamp")
clampFilter?.setDefaults()
clampFilter?.setValue(inputImage, forKey: kCIInputImageKey)


if let clampedImage = clampFilter?.valueForKey(kCIOutputImageKey) as? CIImage {
let explosureFilter = CIFilter(name: "CIExposureAdjust")
explosureFilter?.setValue(clampedImage, forKey: kCIInputImageKey)
explosureFilter?.setValue(-1.0, forKey: kCIInputEVKey)


if let explosureImage = explosureFilter?.valueForKey(kCIOutputImageKey) as? CIImage {
let filter = CIFilter(name: "CIGaussianBlur")
filter?.setValue(explosureImage, forKey: kCIInputImageKey)
filter?.setValue("\(radius)", forKey:kCIInputRadiusKey)


if let result = filter?.valueForKey(kCIOutputImageKey) as? CIImage {
let bounds = UIScreen.mainScreen().bounds
let cgImage = context.createCGImage(result, fromRect: bounds)
let returnImage = UIImage(CGImage: cgImage)
return returnImage
}
}
}
}
return UIImage()
}
小开

找到了另一种方法. . 我使用苹果的 UIImage + Imageeffect。

 UIImage *effectImage = [image applyExtraLightEffect];
self.imageView.image = effectImage;
小开

适用于 Swift 3(iOS 10.0和8.0)

var darkBlur:UIBlurEffect = UIBlurEffect()


if #available(iOS 10.0, *) { //iOS 10.0 and above
darkBlur = UIBlurEffect(style: UIBlurEffectStyle.prominent)//prominent,regular,extraLight, light, dark
} else { //iOS 8.0 and above
darkBlur = UIBlurEffect(style: UIBlurEffectStyle.dark) //extraLight, light, dark
}
let blurView = UIVisualEffectView(effect: darkBlur)
blurView.frame = self.view.frame //your view that have any objects
blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(blurView)
小开

这一个总是保持正确的框架:

public extension UIView {


@discardableResult
public func addBlur(style: UIBlurEffect.Style = .extraLight) -> UIVisualEffectView {
let blurEffect = UIBlurEffect(style: style)
let blurBackground = UIVisualEffectView(effect: blurEffect)
addSubview(blurBackground)
blurBackground.translatesAutoresizingMaskIntoConstraints = false
blurBackground.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
blurBackground.topAnchor.constraint(equalTo: topAnchor).isActive = true
blurBackground.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true
blurBackground.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true
return blurBackground
}
}
小开

这个密码对我来说没问题！ 是 Swift 4. x

let blurEffect = UIBlurEffect(style: .ExtraLight)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.view.frame
self.view.insertSubview(blurEffectView, atIndex: 0)
小开

这招在 Swift 5上很管用

let blurredView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
blurredView.frame = self.view.bounds
backgroundimage.addSubview(blurredView)
小开

您应该始终使用. dark 作为样式，并添加以下代码使其看起来很酷

    blurEffectView.backgroundColor = .black
blurEffectView.alpha = 0.4
小开

在 UIView 扩展中:

func addBlurredBackground(style: UIBlurEffect.Style) {
let blurEffect = UIBlurEffect(style: style)
let blurView = UIVisualEffectView(effect: blurEffect)
blurView.frame = self.frame
blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
self.addSubview(blurView)
self.sendSubviewToBack(blurView)
}
小开 
let blurEffect = UIBlurEffect(style: UIBlurEffect.Style.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.backgroundColor = .black
blurEffectView.alpha = 0.5
blurEffectView.frame = topView.bounds
if !self.presenting {
blurEffectView.frame.origin.x = 0
} else {
blurEffectView.frame.origin.x = -topView.frame.width
}
blurEffectView.frame.origin.x = -topView.frame.width
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
UIView.animate(withDuration: 0.2, delay: 0.0, options: [.curveEaseIn]) {
if !self.presenting {
blurEffectView.frame.origin.x = -topView.frame.width
} else {
blurEffectView.frame.origin.x = 0
}
view.addSubview(blurEffectView)
} completion: { (status) in
                        

}
小开

感谢@Maruta Https://stackoverflow.com/a/56334283/16457129 作为答案如果有人问起，你可以用背景颜色来减少模糊效果。

    func drawBackgroundBlur() {
backgroundView.layer.cornerRadius = 27
// Here, you can increase the alpha value to increase the blur effect
backgroundView.backgroundColor = UIColor.white.withAlphaComponent(0.05)
        

let blurredView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
blurredView.frame = backgroundRewardsView.bounds
blurredView.layer.cornerRadius = 27
backgroundView.addSubview(blurredView)
}


提交答案