14

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);
}
Pwner
  • 3,714
  • 6
  • 41
  • 67

1 Answers1

4

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];
Nick
  • 49
  • 1
  • 3