【问题标题】:Adding clouded shadow to UIView in swift4在swift4中向UIView添加云阴影
【发布时间】:2017-11-22 15:29:43
【问题描述】:

我想为我的 UIView 添加阴影(它不像默认的那样模糊不清),如下所示

我写了一个扩展为

func addShadow(color: UIColor = UIColor.black, opacity: Float = 0.9, radius: CGFloat = 1, scale: Bool = true) {
        self.layer.masksToBounds = false
        self.layer.shadowColor = color.cgColor

        self.layer.shadowOpacity = opacity
        self.layer.shadowRadius = radius

        self.layer.shadowPath = UIBezierPath(rect: self.bounds).cgPath
        self.layer.shouldRasterize = true
        self.layer.rasterizationScale = scale ? UIScreen.main.scale : 1
    }

输出:

但无法获得准确的输出。 您的帮助将不胜感激。

【问题讨论】:

  • self.layer.shadowOffset = CGSizeMake(0, -??) 应该可以解决问题,在哪里 -??是根据您的需要进行测试...
  • 您的shadowPath 是一个矩形。
  • 是的,我怎么能得到它的阴天

标签: ios swift uiview


【解决方案1】:

相信你也需要设置clipsToBounds

self.clipsToBounds = false

【讨论】:

    【解决方案2】:

    我使用 IBInspectable 来处理我的应用程序中的所有视图。试试看

    extension UIView {
    
    @IBInspectable var cornerRadius: CGFloat {
        set {
            layer.cornerRadius = newValue
        }
        get {
            return layer.cornerRadius
        }
    }
    
    @IBInspectable var borderWidth: CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }
    
    @IBInspectable var borderColor: UIColor? {
        set {
            layer.borderColor = newValue?.cgColor
        }
        get {
            return UIColor(cgColor: layer.borderColor!)
        }
    }
    
    @IBInspectable var shadowOffset: CGSize {
        set {
            layer.shadowOffset = newValue
        }
        get {
            return layer.shadowOffset
        }
    }
    
    @IBInspectable var shadowOpacity: Float {
        set {
            layer.shadowOpacity = newValue
        }
        get {
            return layer.shadowOpacity
        }
    }
    
    @IBInspectable var shadowRadius: CGFloat {
        set {
            layer.shadowRadius = newValue
        }
        get {
            return layer.shadowRadius
        }
    }
    
    @IBInspectable var shadowColor: UIColor? {
        set {
            layer.shadowColor = newValue?.cgColor
        }
        get {
            return UIColor(cgColor: layer.shadowColor!)
        }
    }
    

    }

    在您的情况下,您应该修复 shadowOffset 属性。

    【讨论】:

    • 这种方式看起来很棒,但没有和我合作
    【解决方案3】:

    您应该在“containerView”(将阴影放置视图放置为子视图的视图)中禁用 clipToBounds

    看一个例子:

    import UIKit
    
    extension UIView {
        func addShadow(color: UIColor = UIColor.black, opacity: Float = 0.9, radius: CGFloat = 1, scale: Bool = true) {
            self.layer.masksToBounds = false
            self.layer.shadowColor = color.cgColor
            self.layer.shadowOpacity = opacity
            self.layer.shadowRadius = radius
            self.layer.shadowPath = UIBezierPath(rect: self.bounds).cgPath
            self.layer.shouldRasterize = true
            self.layer.rasterizationScale = scale ? UIScreen.main.scale : 1
    
        }
    }
    
    let shadowedView = UIView(frame: CGRect(x: 50, y: 50, width: 200, height: 100))
    shadowedView.backgroundColor = .blue
    shadowedView.layer.cornerRadius = 15.0
    shadowedView.addShadow()
    
    let mainView = UIView(frame: CGRect(x: 0, y: 0, width: 300, height:200))
    mainView.backgroundColor = .white
    mainView.addSubview(shadowedView)
    

    这里我将添加一个视图容器并启用 clipToBounds :

    let shadowedView = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 100))
    shadowedView.backgroundColor = .blue
    shadowedView.layer.cornerRadius = 15.0
    shadowedView.addShadow()
    
    let containerView = UIView(frame: CGRect(x: 50, y: 50, width: 200, height: 100))
    containerView.addSubview(shadowedView)
    containerView.clipsToBounds = true
    
    let mainView = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 200))
    mainView.backgroundColor = .white
    mainView.addSubview(containerView)
    

    【讨论】:

      猜你喜欢
      • 2020-05-21
      • 2018-11-06
      • 1970-01-01
      • 2015-10-23
      • 2014-07-30
      • 2017-10-17
      • 1970-01-01
      • 2013-08-26
      相关资源
      最近更新 更多