添加上的UIView

添加上的UIView

问题描述:

我在Xcode 8和雨燕2.3
this不错的职位和my own question开始工作了一圈模糊的遮罩层,我能得到这个两个不同的效果,但我不能“加入”了。添加上的UIView

enter image description here

第一个(模糊):

internal extension UIView { 

    /** 
    Add and display on current view a blur effect. 
    */ 
    internal func addBlurEffect(style style: UIBlurEffectStyle = .ExtraLight, atPosition position: Int = -1) -> UIView { 
     // Blur Effect 
     let blurEffectView = self.createBlurEffect(style: style) 
     if position >= 0 { 
      self.insertSubview(blurEffectView, atIndex: position) 
     } else { 
      self.addSubview(blurEffectView) 
     } 
     return blurEffectView 
    } 

    internal func createBlurEffect(style style: UIBlurEffectStyle = .ExtraLight) -> UIView { 
     let blurEffect = UIBlurEffect(style: style) 
     let blurEffectView = UIVisualEffectView(effect: blurEffect) 
     blurEffectView.frame = self.bounds 
     blurEffectView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight] 
     return blurEffectView 
    } 

} 

第二个(径向梯度):

public class BlurFilterMask: CAShapeLayer { 

    // MARK: - Public properties - 

    public var origin: CGPoint = CGPointZero 
    public var diameter: CGFloat = 0.0 
    public var gradientWidth: CGFloat = 200.0 
    public var gradientColorOpacity: CGFloat = 0.5 

    // MARK: - Layout - 

    override public func drawInContext(ctx: CGContext) { 
     let clearRegionRadius = self.diameter * 0.5 
     let blurRegionRadius = clearRegionRadius + self.gradientWidth 

     let baseColorSpace = CGColorSpaceCreateDeviceRGB() 

     let colours: [CGFloat] = [0.0, 0.0, 0.0, 0.0,  // Clear region 
            0.0, 0.0, 0.0, self.gradientColorOpacity] // blur region color 
     let colourLocations: [CGFloat] = [0.0, 0.4] 
     let gradient = CGGradientCreateWithColorComponents (baseColorSpace, colours, colourLocations, 2) 
     CGContextDrawRadialGradient(ctx, gradient!, self.origin, clearRegionRadius, self.origin, blurRegionRadius, .DrawsAfterEndLocation) 
    } 
} 

任何提示,将不胜感激!

+0

最近你不是问过类似的问题吗? http://*.com/questions/40256942/draw-hole-on-uiblureffect/40401855#40401855 –

+0

类似的,我不能在孔上应用径向渐变......我尝试过所有可能的组合! –

我做到了!

通知self是一个掩码UIView添加在层次结构顶部。

func setupBlur(frame frame: CGRect, center: CGPoint, diameter: CGFloat) { 

    self.blurFilterMask = BlurFilterMask() 
    self.blurFilterMask.diameter = diameter 
    self.blurFilterMask.frame = self.frame 
    self.blurFilterMask.origin = center 
    self.blurFilterMask.shouldRasterize = true 
    self.layer.addSublayer(self.blurFilterMask) 
    self.blurFilterMask.setNeedsDisplay() 

    self.viewBlur = self.addBlurEffect(style: self.blurEffectStyle, atPosition: 0) 

    self.holePath = self.getHolePath(frame: frame, center: center, diameter: diameter) 

    self.addMaskOnBlurView(self.holePath, center: center, diameter: diameter) 

} 

func addMaskOnBlurView(holePath: UIBezierPath, center: CGPoint, diameter: CGFloat?) -> UIView { 
    let maskView = UIView(frame: self.viewBlur!.bounds) 
    maskView.clipsToBounds = true 
    maskView.backgroundColor = UIColor.clearColor() 

    let blurFilterMask = ERBlurFilterMask() 
    blurFilterMask.diameter = diameter ?? 10 
    blurFilterMask.frame = self.frame 
    blurFilterMask.origin = center 
    blurFilterMask.shouldRasterize = true 
    blurFilterMask.gradientColorOpacity = 1 

    maskView.layer.addSublayer(blurFilterMask) 
    blurFilterMask.setNeedsDisplay() 

    self.viewBlur!.maskView = maskView 
    return maskView 
} 

汇总:

  • 创建掩模视图叠加,称之为上A的层A
  • 加载模糊滤波器掩模
  • 创建模糊视图,称之为B,并附加在上面
  • 创建另一个视图,称之为C,并添加另一个过滤器掩码
  • 将C应用为B的掩码视图

我不知道这是否是解决方案,但它对我有用。 如果有人有另一个更好的解决方案,请分享!