How to do a shadow outside of the fill of a UIView?

Question

I have a cell with a translucent fill. Since the fill is translucent, I can see the shadow behind the fill. How can I hide the shadow under the cell's fill?

self.layer.cornerRadius = 6
self.layer.masksToBounds = false
self.layer.shadowOpacity = 0.8
self.layer.shadowColor = UIColor.black.withAlphaComponent(0.6).cgColor  
self.layer.shadowRadius = 2
self.layer.shadowOffset = CGSize(width: 5, height: 5)

This is what I have:

Desired result with transparent View:

Can you post a screenshot or something? I'm not sure what 1) is happening and 2) what you'd like to happen. — LinusGeffarth, Apr 19 '18 at 13:48
this is current result, we can see shadow inside cell's frame. but I wish to see it only behind cell — Sergey Hleb, Apr 19 '18 at 13:57
Well I guess you'll have to decide between translucency and shadow. — LinusGeffarth, Apr 19 '18 at 13:58
@SergeyHleb, please look into the shadowPath property on CALayer. — vikingosegundo, Apr 19 '18 at 14:52
@vikingosegundo, I use it for another situation, but here it don't helps me — Sergey Hleb, Apr 19 '18 at 14:53
I'm with @LinusGeffarth on this one, however, here is an idea. You could use a rasterized shadow. I mean, make the effect in photoshop or similar, and use the image as a background of the view — OscarVGG, Apr 19 '18 at 15:09
Jeez @vikingosegundo, OP wanted help and if you know how to solve their issue, then just show them. — LinusGeffarth, Apr 19 '18 at 15:43
It's now very easy to do this: https://stackoverflow.com/a/59092828/294884 see the last section — Fattie, Nov 25 '22 at 13:54

Abhirajsinh Thakore · Answer 1 · 2018-04-20T12:27:11.803

0

As per my Understanding you need this kind of View:

You can try this:

    let viewShadow = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
    viewShadow.center = self.view.center
    viewShadow.layer.cornerRadius = 10.0
    viewShadow.layer.borderColor = UIColor.black.cgColor
    viewShadow.layer.borderWidth = 0.5
    viewShadow.backgroundColor = UIColor.white.withAlphaComponent(0.4)
    viewShadow.layer.shadowColor = UIColor.lightGray.cgColor
    viewShadow.layer.shadowOpacity = 1
    viewShadow.layer.shadowOffset = CGSize(width: 20.0, height:  20.0)
    viewShadow.layer.shadowRadius = 5
    self.view.addSubview(viewShadow)

Output

Hope this helps.

edited Apr 20 '18 at 12:27

answered Apr 20 '18 at 11:00

Abhirajsinh Thakore

1,806
2
13
23

View must be with alpha = 0.6, if in your variant I implements transparent, shadow become visible under the cell – Sergey Hleb Apr 20 '18 at 12:15
I just suggested you the way i though it would help you. If it work for you or it helped you do upvote that or approve that @SergeyHleb, so that it praise us – Abhirajsinh Thakore Apr 20 '18 at 12:25
it's not helps in my situation – Sergey Hleb Apr 20 '18 at 12:30
So please can you explain what exactly you want.? – Abhirajsinh Thakore Apr 20 '18 at 12:36
I would to see the shadow behind the fill, only, not under the translucent cell – Sergey Hleb Apr 20 '18 at 12:38
sorry i did not understand, can you please expain that with a ScreenShot.? – Abhirajsinh Thakore Apr 20 '18 at 12:39
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/169441/discussion-between-abhirajsinh-thakore-and-sergey-hleb). – Abhirajsinh Thakore Apr 20 '18 at 12:41
This is completely wrong, solution is here: https://stackoverflow.com/a/59092828/294884 – Fattie Nov 25 '22 at 13:54

score -2 · Answer 2 · answered Apr 19 '18 at 15:12

This might help. All we need to do is alter the shadow path.

    cell.layer.cornerRadius = 6
    cell.layer.masksToBounds = false
    cell.layer.shadowOpacity = 0.8
    cell.layer.shadowColor = UIColor.black.withAlphaComponent(0.6).cgColor
    cell.layer.shadowRadius = 2
    cell.layer.shadowOffset = CGSize(width: 5, height: 5)
    let rect = CGRect(x: cell.frame.origin.x, y: cell.frame.origin.y + cell.frame.size.height, width: cell.frame.size.width, height: 3)
    cell.layer.shadowPath = CGPath(roundedRect: rect, cornerWidth: 1, cornerHeight: 1, transform: nil)

How to do a shadow outside of the fill of a UIView?

2 Answers2