向我的 UIView 添加阴影的最佳方法是什么

Question

我正在尝试为彼此叠加的视图添加阴影，视图折叠允许看到其他视图中的内容，在这种情况下，我想保持view.clipsToBounds ON 以便当视图折叠他们的内容被剪裁了。

这似乎让我很难为图层添加阴影，因为当我打开clipsToBounds 时，阴影也会被剪裁。

我一直在尝试操纵 view.frame 和 view.bounds 以便向框架添加阴影，但允许边界足够大以包含它，但是我没有运气。

这是我用来添加阴影的代码（这只适用于clipsToBounds OFF，如图所示）

view.clipsToBounds = NO;
view.layer.shadowColor = [[UIColor blackColor] CGColor];
view.layer.shadowOffset = CGSizeMake(0,5);
view.layer.shadowOpacity = 0.5;

这是应用到最浅灰色层的阴影的屏幕截图。希望这可以让您了解如果clipsToBounds 关闭，我的内容将如何重叠。

如何为我的UIView 添加阴影并保持内容被剪辑？

编辑：只是想补充一点，我也尝试过使用带有阴影的背景图像，效果很好，但是我仍然想知道最好的编码解决方案。

Answer 1

Wasabii 在 Swift 2.3 中的回答：

let shadowPath = UIBezierPath(rect: view.bounds)
view.layer.masksToBounds = false
view.layer.shadowColor = UIColor.blackColor().CGColor
view.layer.shadowOffset = CGSize(width: 0, height: 0.5)
view.layer.shadowOpacity = 0.2
view.layer.shadowPath = shadowPath.CGPath

在 Swift 3/4/5 中：

let shadowPath = UIBezierPath(rect: view.bounds)
view.layer.masksToBounds = false
view.layer.shadowColor = UIColor.black.cgColor
view.layer.shadowOffset = CGSize(width: 0, height: 0.5)
view.layer.shadowOpacity = 0.2
view.layer.shadowPath = shadowPath.cgPath

如果您使用 AutoLayout，请将此代码放入 layoutSubviews()。

在 SwiftUI 中，这一切都容易得多：

Color.yellow  // or whatever your view
    .shadow(radius: 3)
    .frame(width: 200, height: 100)

Answer 2

所以是的，您应该更喜欢 shadowPath 属性以提高性能，而且： 来自CALayer.shadowPath的头文件

使用该属性显式指定路径通常会 *提高渲染性能，共享相同的路径 * 跨多个层引用

一个鲜为人知的技巧是跨多个层共享相同的引用。当然，它们必须使用相同的形状，但这在表格/集合视图单元格中很常见。

我不知道为什么如果你共享实例它会变得更快，我猜它缓存了阴影的渲染并且可以将它重用于视图中的其他实例。我想知道使用

是否会更快

Answer 3

您也可以从情节提要中为您的视图设置阴影

Answer 4

您可以为 UIView 创建扩展以在设计编辑器中访问这些值

extension UIView{

    @IBInspectable var shadowOffset: CGSize{
        get{
            return self.layer.shadowOffset
        }
        set{
            self.layer.shadowOffset = newValue
        }
    }

    @IBInspectable var shadowColor: UIColor{
        get{
            return UIColor(cgColor: self.layer.shadowColor!)
        }
        set{
            self.layer.shadowColor = newValue.cgColor
        }
    }

    @IBInspectable var shadowRadius: CGFloat{
        get{
            return self.layer.shadowRadius
        }
        set{
            self.layer.shadowRadius = newValue
        }
    }

    @IBInspectable var shadowOpacity: Float{
        get{
            return self.layer.shadowOpacity
        }
        set{
            self.layer.shadowOpacity = newValue
        }
    }
}

Answer 5

试试这个：

UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:view.bounds];
view.layer.masksToBounds = NO;
view.layer.shadowColor = [UIColor blackColor].CGColor;
view.layer.shadowOffset = CGSizeMake(0.0f, 5.0f);
view.layer.shadowOpacity = 0.5f;
view.layer.shadowPath = shadowPath.CGPath;

首先：用作shadowPath 的UIBezierPath 至关重要。如果您不使用它，一开始您可能不会注意到差异，但敏锐的眼睛会观察到在旋转设备和/或类似事件期间发生的某种滞后。这是一项重要的性能调整。

特别针对您的问题：重要的一行是view.layer.masksToBounds = NO。它禁用了对视图层的子层的裁剪，这些子层超出了视图的边界。

对于那些想知道masksToBounds（在层上）和视图自己的clipToBounds 属性之间有什么区别的人来说：真的没有。切换一个会对另一个产生影响。只是抽象级别不同。

---

斯威夫特 2.2：

override func layoutSubviews()
{
    super.layoutSubviews()

    let shadowPath = UIBezierPath(rect: bounds)
    layer.masksToBounds = false
    layer.shadowColor = UIColor.blackColor().CGColor
    layer.shadowOffset = CGSizeMake(0.0, 5.0)
    layer.shadowOpacity = 0.5
    layer.shadowPath = shadowPath.CGPath
}

---

斯威夫特 3：

override func layoutSubviews()
{
    super.layoutSubviews()

    let shadowPath = UIBezierPath(rect: bounds)
    layer.masksToBounds = false
    layer.shadowColor = UIColor.black.cgColor
    layer.shadowOffset = CGSize(width: 0.0, height: 5.0)
    layer.shadowOpacity = 0.5
    layer.shadowPath = shadowPath.cgPath
}

Answer 6

关于 viewWillLayoutSubviews：

override func viewWillLayoutSubviews() {
    sampleView.layer.masksToBounds =  false
    sampleView.layer.shadowColor = UIColor.darkGrayColor().CGColor;
    sampleView.layer.shadowOffset = CGSizeMake(2.0, 2.0)
    sampleView.layer.shadowOpacity = 1.0
}

使用 UIView 的扩展：

extension UIView {

    func addDropShadowToView(targetView:UIView? ){
        targetView!.layer.masksToBounds =  false
        targetView!.layer.shadowColor = UIColor.darkGrayColor().CGColor;
        targetView!.layer.shadowOffset = CGSizeMake(2.0, 2.0)
        targetView!.layer.shadowOpacity = 1.0
    }
}

用法：

sampleView.addDropShadowToView(sampleView)

Answer 7

诀窍是正确定义视图层的masksToBounds 属性：

view.layer.masksToBounds = NO;

它应该可以工作。

(Source)