Swift uiview with rounded corners and drop shadow does not work

Question

I am trying to add rounded corners and drop shadow to my UIView:

myView.layer.cornerRadius = 2
myView.layer.masksToBounds = false    
    myView.layer.shadowColor = UIColor.black.cgColor
    myView.layer.shadowOffset = CGSize(width: 0, height: 1)
    myView.layer.shadowOpacity = 0.4
    myView.layer.shadowPath = UIBezierPath(roundedRect: myView.bounds, cornerRadius: 2).cgPath

But this will make the shadow drop very far on the right and bottom which is wrong.

I am placing this code in ViewDidLoad() since I already have another subclass for my UIView so I want to add the shadow in the VC and not in a subclass

But if I place the code in a subclass it will work:

import UIKit

public class ShadowView: UIView {

    open var cornerRadius: CGFloat = 2

    open var shadowOffsetWidth: Int = 0
    open var shadowOffsetHeight: Int = 2
    open var shadowColor: UIColor? = UIColor.black
    open var shadowOpacity: Float = 0.4

    override open func layoutSubviews() {

        layer.cornerRadius = cornerRadius
        let shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius)

        layer.masksToBounds = false
        layer.shadowColor = shadowColor?.cgColor
        layer.shadowOffset = CGSize(width: shadowOffsetWidth, height: shadowOffsetHeight)
        layer.shadowOpacity = shadowOpacity
        layer.shadowPath = shadowPath.cgPath
    }

}

But how can I make it work with placing the code in my main VC and not a subclass?

I would try putting your VC layer code in viewDidLayoutSubviews instead of viewDidLoad. Your view will be properly sized by that point. — Joshua Kaden, Oct 26 '16 at 15:53
(On a side note, I couldn't help but notice that your ShadowView code isn't calling super.layoutSubviews) — Joshua Kaden, Oct 26 '16 at 15:54
@JoshuaKaden the code comes from this repo: https://github.com/NathanWalker/MaterialCard and why must I call super.layoutSubviews? — user2636197, Oct 26 '16 at 15:57
It's good OOP practice to call super when overriding. It's the L in SOLID: https://en.wikipedia.org/wiki/SOLID_(object-oriented_design) — Joshua Kaden, Oct 26 '16 at 16:01
@JoshuaKaden viewDidLayoutSubviews fixed it. Post a answer and I will accept :) — user2636197, Oct 26 '16 at 16:04
Check out paintcode, they will release a swift 3 compatible version soon and in the meantime they have a private beta you can sign up for. It will make your life much easier, including situations like this. Better performance also, rounding corners with layer.cornerRadius is very demanding. Check out what AsyncDisplayKit has to say on the subject. http://asyncdisplaykit.org/docs/corner-rounding.html — JustinM, Oct 29 '16 at 08:50
Look for Swift 3 & IBInspectable extension solution: http://stackoverflow.com/a/43958505/3052059 — Thomás Pereira, May 13 '17 at 22:22

score 3 · Accepted Answer · answered Oct 26 '16 at 16:05

3

I would try putting your VC layer code in viewDidLayoutSubviews instead of viewDidLoad. Your view will be properly sized by that point.

answered Oct 26 '16 at 16:05

Joshua Kaden

1,210
11
16

Swift uiview with rounded corners and drop shadow does not work

1 Answers1