How do you only show a shadow outside of the fill of a UIView?

cocoa-touch, ios, iphone

Solution

I was able to get this desired effect using something like the following:

...
someLayer.backgroundColor = [[UIColor greenColor] CGColor];
someLayer.shadowOpacity = 1.0;
someLayer.shadowOffset = CGSizeMake(10.0, 10.0);
someLayer.shadowColor = [[UIColor blackColor] CGColor];

someLayer.rasterizationScale = [[UIScreen mainScreen] scale];
someLayer.shouldRasterize = YES;
someLayer.opacity = 0.5;

[[self layer] addSublayer:someLayer];

Problem

I have a UIView with a translucent fill and a drop shadow. Since the fill is translucent, I can see the shadow behind the fill. ``` - (id)init { self = [super init]; if (self) { self.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.8]; self.layer.shadowColor = [UIColor blackColor].CGColor; self.layer.shadowOffset = CGSizeMake(0.0, 0.0); self.layer.shadowOpacity = 0.5; self.layer.shadowRadius = 2.0; self.layer.cornerRadius = 3.0; } return self; } ``` I do not like this behavior. I cannot see anything behind the view because the fill's opacity + the shadow's opacity > 100%. How do I make it like CSS where the shadow is only drawn outside of a box's border? ``` .someStyle { background: white; opacity: 0.8; box-shadow: 0 0 1em rgba(0,0,0,0.5); } ```

Original source

Related problems