Question

我想在左上方和右上方添加圆角，并在其周围添加阴影（底部除外）。底部不应有阴影。我能够根据需要实现圆角。但不是影子。我需要实现两者的代码。在下面的图像中查看“诊断”视图。它的左上角和右上角圆角并且周围有阴影。

Answer 1

您可以使用扩展程序

在Swift 4.1和Xcode 9.3.1中

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

Answer 2

  @IBOutlet var btnActive : UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()


      //  btnActive.backgroundColor = UIColor(red: 171, green: 178, blue: 186, alpha: 1.0)
        // Shadow and Radius
        btnActive.layer.shadowColor = UIColor(red: 255, green: 255, blue: 255, alpha: 1).cgColor
        btnActive.layer.shadowOffset = CGSize(width: 0.0, height: 2.0)
        btnActive.layer.shadowOpacity = 2.0
        btnActive.layer.shadowRadius = 5.0
        btnActive.layer.masksToBounds = false
        btnActive.layer.cornerRadius = 4.0
    }

Answer 3

尝试此代码。自定义方法。 Swift 4.0

@IBOutlet weak var myView: UIView!
override func viewDidLoad() {
    super.viewDidLoad()
    customCornerWithShadow(myView: myView, cornerRadius: 20)
}

func customCornerWithShadow(myView:UIView,cornerRadius:CGFloat) {

    myView.layer.cornerRadius = cornerRadius
    myView.clipsToBounds = false[enter image description here][1]
    myView.layer.maskedCorners = CACornerMask(rawValue: CACornerMask.RawValue(UInt8(CACornerMask.layerMinXMinYCorner.rawValue) | UInt8(CACornerMask.layerMaxXMinYCorner.rawValue)))

    myView.layer.shadowColor = #colorLiteral(red: 0.3098039329, green: 0.01568627544, blue: 0.1294117719, alpha: 1)
    myView.layer.shadowOffset = CGSize(width:0, height:-1)

    let shadowPath = UIBezierPath(roundedRect: myView.bounds, cornerRadius: cornerRadius)
    myView.layer.shadowPath = shadowPath.cgPath
    myView.layer.shadowOpacity = 1
}

Answer 4

找到了解决方案：

clipsToBounds = true，使拐角变圆，但阴影被隐藏。因此我们可以使用2个视图，其中一个作为容器，主视图作为其子视图。容器的clipstobound = false，主视图的clipstobounds为true。

let containerV = UIView(frame: CGRect(x: 0, y: 0, width: self.frame.size.width , height: 50))
containerV.clipsToBounds = false
containerV.layer.shadowColor = UIColor.black.cgColor
containerV.layer.shadowOpacity = 1 
containerV.layer.shadowOffset = CGSize(width: -0.5, height: -3.0) 
/* since we dont want shadow at bottom */
containerV.layer.shadowRadius = 2
containerV.layer.shadowPath = UIBezierPath(roundedRect: containerV.bounds, 
cornerRadius: 10).cgPath

let headerLabel  = UILabel()
headerLabel.frame = containerV.bounds
headerLabel.text = "Test Header"
headerLabel.backgroundColor = UIColor.white

headerLabel.clipsToBounds = true
headerLabel.layer.cornerRadius = 10
if #available(iOS 11.0, *) {
        headerLabel.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
    } else {
        // Fallback on earlier versions
    }
containerV.addSubview(headerLabel)

将阴影和角落添加到UIView（底部除外）

4 个答案: