How to convert a css box shadow to IOS shadow

Question

I would like to know how to convert the following CSS box shadow to iOS shadow. The CSS box shadow is as follows

box-shadow: -2px -4px 4px 0 #e5e5e5, 2px 4px 4px 0 rgba(0, 0, 0, 0.25);

Answer 1

If this is what you're going for:

You can do it by setting the view's layer shadow and adding a sublayer with another shadow:

class BoxShadowView: UIView {
    
    let layer1 = CALayer()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        commonInit()
    }
    func commonInit() -> Void {
        
        layer.masksToBounds = false
        layer.shouldRasterize = true
        layer.shadowRadius = 4
        layer.shadowOffset = CGSize(width: -2, height: -4)
        layer.shadowColor = UIColor.black.cgColor
        layer.shadowOpacity = 0.1
        
        layer1.masksToBounds = false
        layer1.shouldRasterize = true
        layer1.shadowRadius = 4
        layer1.shadowOffset = CGSize(width: 2, height: 4)
        layer1.shadowColor = UIColor.black.cgColor
        layer1.shadowOpacity = 0.25
        
        layer.addSublayer(layer1)
        
    }
    
    override func layoutSubviews() {
        super.layoutSubviews()
        layer1.backgroundColor = backgroundColor?.cgColor
        layer1.frame = bounds
    }
    
}

Here's a simple example usage (what I used to create that image):

class BoxShadowTestViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // create a BoxShadowView
        let boxView = BoxShadowView()
        
        // create a label
        let label = UILabel()
        
        [boxView, label].forEach {
            $0.translatesAutoresizingMaskIntoConstraints = false
        }
        
        // add label to boxView
        boxView.addSubview(label)
        
        // add boxView to view
        view.addSubview(boxView)
        
        // respect safe area
        let g = view.safeAreaLayoutGuide
        
        NSLayoutConstraint.activate([
            
            // boxView Width & Height
            boxView.widthAnchor.constraint(equalToConstant: 240.0),
            boxView.heightAnchor.constraint(equalToConstant: 120.0),
            // center in view
            boxView.centerXAnchor.constraint(equalTo: g.centerXAnchor),
            boxView.centerYAnchor.constraint(equalTo: g.centerYAnchor),
            
            // center label in boxView
            label.centerXAnchor.constraint(equalTo: boxView.centerXAnchor),
            label.centerYAnchor.constraint(equalTo: boxView.centerYAnchor),

        ])
        
        // set boxView background color
        boxView.backgroundColor = .white
        
        // set label text
        label.text = "Test Label"
        
    }
    
}