如何创建具有模糊效果的透明视图?

How create transparent view with with blur effect?

我学习了如何创建 UI 并在 www 中找到了我想自己重复的设计的平静。我可以创建主视图,然后添加带有所有元素的子视图,如下例所示,但我无法创建具有模糊效果的子视图,如示例所示,我正在尝试创建子视图,然后添加其他平和视图并添加模糊,但我可以创建副本作为示例。

创建此视图的正确方法是什么?我不明白为了这种效果我需要对视图进行哪些操作,这是一个具有视图 alpha 和模糊效果或其他东西的技巧?

我找到了一个很好的教程,可以帮助您创建具有模糊效果的平滑透明视图:https://www.raywenderlich.com/167-uivisualeffectview-tutorial-getting-started

我使用下一种方法解决了这个任务:

首先:为子视图创建了渐变层。

其次:添加了 UIVisualEffectView 和 VibrancyEffect。

如何使用本网站的信息创建渐变 (https://www.appcoda.com/cagradientlayer/)

为了增加活力效果,使用了该项目的源代码 (https://github.com/ide/UIVisualEffects)

我的源代码:

func createGradientLayer() {
    gradientLayer = CAGradientLayer()
    gradientLayer.cornerRadius = 10
    gradientLayer.frame = self.placeholder.bounds
    gradientLayer.locations = [0.0, 0.35]
 
    gradientLayer.colors = [UIColor.blue.cgColor, UIColor.white.cgColor]
 
    self.placeholder.layer.addSublayer(gradientLayer)
}

override func viewDidLoad() {
    super.viewDidLoad()

    createGradientLayer()


    let lightBlur = UIBlurEffect(style: .light)
    let lightBlurView = UIVisualEffectView(effect: lightBlur)
    lightBlurView.layer.cornerRadius = 10
    lightBlurView.layer.masksToBounds = true
    
    placeholder.addSubview(lightBlurView)
    
    lightBlurView.frame.size.height = placeholder.frame.size.height
    lightBlurView.frame.size.width = placeholder.frame.size.width

    let lightVibrancyView = vibrancyEffectView(forBlurEffectView: lightBlurView)
    lightBlurView.contentView.addSubview(lightVibrancyView)
    
}

   fileprivate func vibrancyEffectView(forBlurEffectView blurEffectView:UIVisualEffectView) -> UIVisualEffectView {
        let vibrancy = UIVibrancyEffect(blurEffect: blurEffectView.effect as! UIBlurEffect)
        let vibrancyView = UIVisualEffectView(effect: vibrancy)
        vibrancyView.frame = blurEffectView.bounds
        vibrancyView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        return vibrancyView
    }

最后一个例子: