修复UIVisualEffectView在白色背景上呈现灰色的额外光线模糊

时间:2016-07-22 07:36:32

标签: ios swift uivisualeffectview

Apple提供了这个实时模糊视图课程UIVisualEffectView,您将其与UIBlurEffect一起使用,其中三个可用UIBlurEffectStyles中的一个:

enum UIBlurEffectStyle : Int {
    case ExtraLight
    case Light
    case Dark
}

现在出于演示目的,我使用样式LightExtraLight设置了两个效果视图:

let lightBlur = UIBlurEffect(style: UIBlurEffectStyle.Light)
let extraLightBlur = UIBlurEffect(style: UIBlurEffectStyle.ExtraLight)

let lightView = UIVisualEffectView(effect: lightBlur)
lightView.frame = CGRectMake(10, 30, 150, 150)
self.view.addSubview(lightView)

let extraLightView = UIVisualEffectView(effect: extraLightBlur)
extraLightView.frame = CGRectMake(160, 30, 150, 150)
self.view.addSubview(extraLightView)

到目前为止一切顺利,一切都按预期工作,它们模糊图像:

image

也有关于颜色的工作:

black red

但是当遇到白色背景时会发生这种情况:

white

左侧的Light效果按预期工作,但右侧的ExtraLight效果会留下某种灰色方块。

现在的问题是:是否有任何技巧或方法可以让我在白色背景上使用额外的光线模糊效果(支持实时模糊)并删除那个丑陋的灰色阴影?

7 个答案:

答案 0 :(得分:5)

据我所知,附加色是UIVisualEffectView类的内置功能。如果使用Xcode检查视图层次结构,则可以看到视觉效果视图实例中有两个默认子视图:UIVisualEffectBackdropViewUIVisualEffectSubview。 (我假设它们是私有类。)如果您检查UIVisualEffectSubview,您会发现它的背景色会导致您注意到不想要的色调。

我不确定是否有官方支持的方法来删除它,但是您可以通过过滤为私有子视图的名称来修改背景颜色:

if let vfxSubView = visualEffectView.subviews.first(where: {
    String(describing: type(of: $0)) == "_UIVisualEffectSubview"
}) {
    vfxSubView.backgroundColor = UIColor.white.withAlphaComponent(0.7)
}

(兼容Swift 5)

默认色度约为70%,因此最简单的方法是将目标背景色与0.7 alpha分量一起使用。

我还注意到,如果视觉效果包含自定义子视图,则此设置可能会重置为默认值。如果我将相同的代码段添加到视图控制器的viewDidLayoutSubviews函数中,那么即使更新了内置子视图,它也将保留自定义背景色。

这是一个具有深色模糊效果样式的示例。顶部显示默认色调,底部显示自定义黑色背景色,不透明度为70%。

enter image description here

答案 1 :(得分:3)

如果您只是想要模糊并且您的模糊视图将静止不动,您可以使用UIImageEffects课程并将tintColor更改为"完整"白:

- (UIImage *)applyExtraLightEffect
{
    UIColor *tintColor = [UIColor colorWithWhite:0.97 alpha:0.82];
    return [self applyBlurWithRadius:20 tintColor:tintColor saturationDeltaFactor:1.8 maskImage:nil];
}

据我所知,您无法在UIVisualEffectView中更改它。

答案 2 :(得分:1)

您可以尝试:

var visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))    
visualEffectView.frame = imageView.bounds
imageView.addSubview(visualEffectView)

答案 3 :(得分:1)

简单解决方案

我可以找到一个受Shannon Hughes' Blog Post启发的简单解决方案。只需在效果视图中添加透明的白色背景颜色即可。我不知道它是否与extraLight完全相同,但对我来说它足够接近。

let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
visualEffectView.frame = sectionHeaderView.bounds
visualEffectView.backgroundColor = UIColor(white: 1.0, alpha: 0.9)
sectionHeaderView.addSubview(visualEffectView)

答案 4 :(得分:1)

与Swift 5兼容

当背景视图为白色时,我使视觉效果视图完全变为白色的方式。

let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
blurView.backgroundColor = UIColor.white.withAlphaComponent(0.7)

答案 5 :(得分:0)

let vc = UIViewController()
vc.view.frame = self.view!.frame
let efv = UIVisualEffectView(effect: UIBlurEffect(style: UIBlurEffectStyle.light))
efv.frame = vc.view.frame
vc.view.addSubview(efv)
self.addChildViewController(vc)
self.view.addSubview(vc.view)
// below method has a bug
// self.present(vc, animated: true, completion:nil)

答案 6 :(得分:0)

我建议将extraLightView添加到UIColor(white: 1.0, alpha: 0.x)的视图中,其中x可以基于滚动视图的contentOffset进行修改。当视图后无任何内容时,extraLightView为1时,您的x将为白色。滚动并修改x时,您将不会修改UIVisualEffectView(强烈建议不要这样做,而是使用其父视图,这是绝对安全的。