UIView左右阴影

Posted 2023-03-13

【中文标题】UIView左右阴影

【英文标题】：Shadow left and right of UIView

【发布时间】：2013-01-08 16:19:52

【问题描述】：

您好，我喜欢向视图中添加 CALayer 阴影，其中阴影位于视图的左右，最简单的方法是：

someView.layer.shadowColor = [[UIColor blackColor] CGColor];
someView.layer.shadowOffset = CGSizeMake(0.0f,0.0f);
someView.layer.shadowOpacity = 1.0f;
someView.layer.shadowRadius = 10.0f;
someView.layer.shadowPath = [[UIBezierPath bezierPathWithRect:someView.bounds] CGPath];

但是当我增加 shadowRadius 它看起来不太好时，我会添加一个更大的阴影，就像一个阴影一样。如何制作左右两边都好看的阴影。

【参考方案1】：

我认为 10 是一个相当大的阴影半径，尝试 3 或 4 代替，不透明度我通常使用 0.7：

someView.layer.shadowColor = [[UIColor blackColor] CGColor];
someView.layer.shadowOffset = CGSizeMake(0.0f,0.0f);
someView.layer.shadowOpacity = 0.7f;
someView.layer.shadowRadius = 4.0f;

如果您只想要左右阴影，则在顶部和底部插入矩形，以便顶部和底部阴影隐藏在您的视图后面：

CGRect shadowRect = CGRectInset(someView.bounds, 0, 4);  // inset top/bottom
someView.layer.shadowPath = [[UIBezierPath bezierPathWithRect:shadowRect] CGPath];

我不确定这是否是你想要的。

【讨论】：

我和我的设计师谈过这个影子太小了。我需要左右不同的 x 偏移量。

惊人的答案，但是有人用圆角实现了这个（更平滑），因为这个类似矩形的阴影看起来很糟糕。有什么见解吗？提前致谢 ！ :)

使用 bezierPathWithRoundedRect 代替

我不知道为什么会有这么多选票。在我的实现中，正如预期的那样，它可以防止侧面阴影一直到达侧面的顶部和底部。

@progrmr 我想要具有特定侧面的内部阴影，例如仅顶部或顶部/右侧。有什么建议吗？

【参考方案2】：

swift 3.0 版本

imageView.layer.shadowOpacity = 0.8
imageView.layer.shadowOffset = CGSize(width: 0, height: 3)
imageView.layer.shadowRadius = 4.0

let shadowRect: CGRect = imageView.bounds.insetBy(dx: 0, dy: 4)
imageView.layer.shadowPath = UIBezierPath(rect: shadowRect).cgPath

【参考方案3】：

progrmr 的回答很有帮助，干杯！

我制作了一个滑出式菜单，但我遇到了 VC 周围的阴影并破坏了导航栏的问题。结果我不得不插入阴影层。

这是我使用 swift 的解决方案：

rightViewController!.view.layer.shadowOpacity = 0.8
rightViewController!.view.layer.shadowOffset = CGSizeMake(0, 3)
rightViewController!.view.layer.shadowRadius = 4.0

let shadowRect: CGRect = CGRectInset(rightViewController!.view.bounds, 0, 4);  // inset top/bottom
rightViewController!.view.layer.shadowPath = UIBezierPath(rect: shadowRect).CGPath

【参考方案4】：

我创建了一个可以在顶部/底部或左侧/右侧使用的阴影，完全没有偏见。如果选择上/下，左/右将不会出现阴影，依此类推。我希望我有所帮助。代码如下：

import UIKit

class ViewController: UIViewController 
  
    
     override func viewDidLoad() 
        super.viewDidLoad()
        
        let imgView = UIImageView(frame: CGRect(x: self.view.bounds.midX - 150, y: self.view.bounds.midY - 150, width: 300, height: 300))
            
        imgView.contentMode = .scaleToFill
        imgView.image = UIImage(named: "name image")

        self.view.addSubview(imgView)
        //You can put left/right or top/bottom
        imgView.addShadow(sides: .leftRight, constant: 10, alpha: 5)

        
     



extension UIView
    
    func addShadow(sides: Sides, constant: Int, alpha: Int)
        if(constant > 0 && alpha > 0)
        switch sides 
            case .leftRight:
   
                let view = UIView(frame: CGRect(x: -CGFloat(constant), y: 0, width: self.bounds.width + CGFloat((constant * 2)), height: self.bounds.height))
                self.addSubview(view)

                addMask(sides: .leftRight, view: view, constant: constant, shadowRadius: alpha)
                
            case .topBottom:

                let view = UIView(frame: CGRect(x: 0, y: -CGFloat(constant), width: self.bounds.width , height: self.bounds.height + CGFloat(constant * 2)))
                self.addSubview(view)

                addMask(sides: .topBottom, view: view, constant: constant, shadowRadius: alpha)

            
        
    
    
    private func addMask(sides:Sides, view: UIView, constant: Int, shadowRadius:Int)
        let mutablePath = CGMutablePath()
        let mask = CAShapeLayer()

        switch sides 
        case .leftRight:
            
            mutablePath.addRect(CGRect(x: -CGFloat(constant), y: 0, width: view.bounds.width, height: view.bounds.height))

            mutablePath.addRect(CGRect(x: CGFloat(constant) , y: 0, width: view.bounds.width , height: view.bounds.height))

            
        case .topBottom:
            
            mutablePath.addRect(CGRect(x: 0, y: -CGFloat(constant), width: view.bounds.width, height: view.bounds.height))

            mutablePath.addRect(CGRect(x: 0, y: CGFloat(constant) , width: view.bounds.width , height: view.bounds.height))
        

        mask.path = mutablePath

        mask.fillRule = CAShapeLayerFillRule.evenOdd
        mask.fillColor  = UIColor(white:1.0, alpha: 0.2).cgColor
        view.layer.mask = mask
        view.layer.addSublayer(mask)
        mask.shadowColor = UIColor.black.cgColor
        mask.shadowRadius = CGFloat(shadowRadius)
        mask.shadowOpacity = 1.0
        mask.shadowOffset = CGSize(width: 0, height: 0)

    


enum Sides
    case leftRight
    case topBottom

你只需要调用扩展UIView，它有addShadow()函数并传递你想要的参数。