CODEWITHSUNDEEP
swiftshadowsketchapp
Talon Brown
Talon Brown

Reputation: 137

Swift shadow does not spread correctly

I'm been trying to create a shadow for my UIView. I looked around and found an extension for the CALayer class from this post. https://stackoverflow.com/a/48489506/9188318

So far its been working well for me until I try to put in a non 0 number for the spread.

With the spread being 0. This is the result

Using 0 spread

And here is the result using a spread of 1

Using 1 spread

And it gets even worse with a spread of 5

Using a spread of 5

The problem that I'm having is that it doesn't have rounded corners and I have no idea how to fix this. Heres my code for the UIView that uses this view. The extension that is used to make the shadow is in the post above.

UIView code

class FileCalculateOperatorSelectionButton : UIView {

    private var isActivated : Bool = false

    //Background colors
    private var unSelectedBackgroundColor : UIColor = UIColor(red: 178/255, green: 90/255, blue: 253/255, alpha: 1.0)
    private var selectedBackgroundColor : UIColor = UIColor.white
   
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.commonInit()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)
        self.commonInit()
    }

    private func commonInit() {
        self.layer.cornerRadius = self.frame.height/2
        self.backgroundColor = self.unSelectedBackgroundColor
    
        let shadowColor = UIColor(red: 0xC8, green: 0xC6, blue: 0xC6)

        //Change the spread argument here
        self.layer.applySketchShadow(color: .black, alpha: 0.5, x: 0, y: 0, blur: 5, spread: 0)
    }   
}

Upvotes: 0

Views: 139

Answers (2)

Omer Faruk Ozturk
Omer Faruk Ozturk

Reputation: 1872

Change shadowPath in applySketchShadow function in CALayer extension like below;

// shadowPath = UIBezierPath(rect: rect).cgPath
shadowPath = UIBezierPath(roundedRect: rect, cornerRadius: cornerRadius).cgPath

when spread: 1

enter image description here

Upvotes: 0

PGDev
PGDev

Reputation: 24341

Try setting the layer's masksToBounds property to true.

self.layer.masksToBounds = true

Upvotes: 1

Related Questions