如何在Swift中添加2pt半径的模糊?

时间:2016-08-13 17:21:17

标签: ios swift uiblureffect

我想创造类似的东西:

enter image description here

我试过这个:

var blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Dark)
var blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
view.addSubview(blurEffectView)

但这会产生很暗的模糊。但我需要半径为2pt的暗模糊(黑色)。

我可以在Swift中实现吗?

4 个答案:

答案 0 :(得分:4)

您无法控制UIVisualEffectView模糊的半径。您可以通过快照想要模糊的视图并应用CoreImage" CIGaussianBlur"来实现您想要的效果。过滤到该快照,然后在您想要模糊的视图正上方的UIImageView中显示模糊图像。使用CIGaussianBlur,您可以将模糊半径应用于任意长度。

您可以使用UIView上的扩展程序来更方便:

extension UIView
{
    func snapshotView(scale scale: CGFloat = 0.0, isOpaque: Bool = true) -> UIImage
    {
        UIGraphicsBeginImageContextWithOptions(self.bounds.size, opaque, scale)
        self.drawViewHierarchyInRect(self.bounds, afterScreenUpdates: true)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image
    }

    func blur(blurRadius blurRadius: CGFloat) -> UIImage?
    {
        guard let blur = CIFilter(name: "CIGaussianBlur") else { return nil }

        let image = self.snapshotView(scale: 1.0, isOpaque: true)
        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: 0,
                                  y: 0,
                                  width: frame.width,
                                  height: frame.height)

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

        return UIImage(CGImage: cgImage)
    }
}

然后,您可以添加半透明叠加层以确定模糊的暗度,例如:

let overlay = UIView()
overlay.frame = view.bounds
overlay.backgroundColor = UIColor(white: 0.0, alpha: 0.30)
viewIWantToBlur.addSubview(overlay)
let image = viewIWantToBlur.blur(blurRadius: 2.0)
imageView.image = image

有关此方法的更多信息以及更强大的工作示例,您可以看到here.您应该知道这是性能密集型的。

答案 1 :(得分:0)

如果您使用故事板,这是一个简单的方法。 首先,您需要在上方的故事板中添加“带有模糊的视觉效果视图”,在其中可以看到您的图像,UIUiew或uielement。 现在绘制视觉效果视图的出口,如下所示: -

 @IBOutlet weak var blurredViewVisulaEffect: UIVisualEffectView!

并在viewDidLoad方法中添加这两行

let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Light)
blurredViewVisulaEffect.effect = blurEffect

根据我们的要求对视图进行操作: - 现在,如果要自定义图像的模糊度,则从storyboard更改 UIVisualEffectView 的alpha值。将 Alpha 的值保持在0.5到0.8之间,以获得所需的模糊度。 如果你想改变视图的阴影/颜色,就像你在光明和黑暗之间所提到的那样,你需要将你的UIVisualEffectView的背景颜色设置为黑色,并将其不透明度从100%更改为30%(或根据要求可能是40)。

然后在viewDidLoad()

中将视图的边框设置为2 px,如下所示
blurredImageViewVisulaEffect.layer.borderColor = UIColor.grayColor().CGColor;
blurredImageViewVisulaEffect.layer.borderWidth = 2.0 

答案 2 :(得分:0)

为了制作UIVisualEffectView的半径,试试这个:

 blurEffectView.clipsToBounds = true  
然后指定半径:

 
blurEffectView.layer.cornerRadius = 20 
blurEffectView.layer.borderColor = UIColor(red:222/255, green:225/255, blue:227/255, alpha: 1).cgColor
blurEffectView.layer.borderWidth = 2  

答案 3 :(得分:0)

可以使用ios私有API更改模糊半径。我为您提供解决方案: https://github.com/perfectdim/CustomBlurEffectView

用法:

import CustomBlurEffectView

let customBlurEffectView = CustomBlurEffectView(
    radius: 20, // Set blur radius value. Defaults to `10` (CGFloat)
    color: .cyan, // Set tint color value. Defaults to `nil` (UIColor?)
    colorAlpha: 0.4 // Set tint color alpha value. Defaults to `0.8` (CGFloat)
)
customBlurEffectView.frame = CGRect(x: 0, y: 0, width: 300, height: 300)
addSubview(customBlurEffectView)