Swift 圆角阴影封装

1. 效果:

image.png

2. 对应设计稿参数, 不管是蓝湖 / Codesign / Sketch

Codesign

3. 封装

import UIKit
import Foundation

/// 阴影&圆角封装
final class RoundShadowView<T: UIView>: UIView {
    
    /// 用于盛放子视图的容器
    var content = T()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupSubviews()
    }
    
    private func setupSubviews() {
        content = T()
        addSubview(content)
        content.frame = bounds
        content.backgroundColor = .white
    }
    
    /// 设置阴影参数
    /// - Parameters:
    ///   - blur: 对应 Sketch 阴影 "模糊" 设置
    ///   - alpha: 对应 Sketch 阴影 "颜色" 的alpha值 例: 40% 即 0.4
    ///   - radius: 圆角半径
    ///   - color: 对应 Sketch 阴影 "颜色"
    ///   - offset: 对应 Sketch 阴影 "偏移" x y, CGSize(width: x, height: y)
    ///   - expand: 对应 Sketch 阴影 "扩展" 值
    func addShadow(blur: CGFloat,
                   alpha: Float,
                   corner radius: CGFloat,
                   color: UIColor = .black,
                   offset: CGSize = .zero,
                   expand: CGFloat = 0) {
        // 内容视图圆角大小
        content.layer.cornerRadius = radius
        content.layer.masksToBounds = true
        
        // 对应 Sketch 阴影 "颜色" 的alpha值 40% 即 0.4
        layer.shadowOpacity = alpha
        // 对应 Sketch 阴影 "偏移" x y
        layer.shadowOffset = offset
        // 对应 Sketch 阴影 "模糊" 设置, 值是 blur / 2
        layer.shadowRadius = blur / 2
        // 对应 Sketch 阴影 "颜色"
        layer.shadowColor = color.cgColor
        // 对应 Sketch 阴影 "扩展" 值 用来设置阴影的范围
        let rect = bounds.insetBy(dx: -expand, dy: -expand)
        // 阴影的范围
        layer.shadowPath = CGPath(roundedRect: rect,
                                  cornerWidth: radius,
                                  cornerHeight: radius,
                                  transform: nil)
    }
  
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

4. 使用

fileprivate func setupSubviews() {
    // 初始化
    let shadowView = RoundShadowView<UIView>(frame: CGRect(x: 20,
                                                           y: 100,
                                                           width: UIScreen.main.bounds.width - 40,
                                                           height: 158))
    // 添加到父视图
    view.addSubview(shadowView)
    // 设置圆角阴影参数
    shadowView.addShadow(blur: 10,
                         alpha: 0.1,
                         corner: 34,
                         color: UIColor.black,
                         offset: CGSize(width: 0, height: 2),
                         expand: 5)
}

注意: 1. 离屏渲染我搞不定
注意: 2. 初始化必须有确切的frame
注意: 3. 如果你们有更好的解决办法, 请一定要告诉我