Ios – Stop CALayer shadow from affecting subviews

calayeriosios8shadowuiview

I have a custom UIControl, and I want it to have a shadow, so I set the relevant properties on its layer. A shadow appears around the view as desired, but a shadow also appears under the text of a UILabel, which is a subview. How do you stop this? I only want the shadow around the outer superview.

enter image description here

...
init() {        
    label = UILabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    self.translatesAutoresizingMaskIntoConstraints = false
    addSubview(label)

    self.layer.masksToBounds = false
    self.layer.shadowColor = UIColor.blackColor().CGColor
    self.layer.shadowOpacity = 1.0
    self.layer.shadowRadius = 2.0

    // Adding these lines trying to explicitly stop shadow on label...
    label.layer.shadowOpacity = 0
    label.layer.shadowColor = nil
    ...
}

Best Answer

This happens when parent view has alpha less than 1.0 or has no background color (i.e is set to clear color). In that case shadow translates to subviews. See my answer here for more details.

Apple Docs prove this:

Figure A-7 shows several different versions of the same sample layer with a red shadow applied. The left and middle versions include a background color so the shadow appears only around the border of the layer. However, the version on the right does not include a background color. In this case, the shadow is applied to the layer’s content, border, and sublayers.

Shadow

Related Solutions

Ios – How to remove all subviews

Edit: With thanks to cocoafan: This situation is muddled up by the fact that NSView and UIView handle things differently. For NSView (desktop Mac development only), you can simply use the following:

[someNSView setSubviews:[NSArray array]];

For UIView (iOS development only), you can safely use makeObjectsPerformSelector: because the subviews property will return a copy of the array of subviews:

[[someUIView subviews]
 makeObjectsPerformSelector:@selector(removeFromSuperview)];

Thank you to Tommy for pointing out that makeObjectsPerformSelector: appears to modify the subviews array while it is being enumerated (which it does for NSView, but not for UIView).

Please see this SO question for more details.

Note: Using either of these two methods will remove every view that your main view contains and release them, if they are not retained elsewhere. From Apple's documentation on removeFromSuperview:

If the receiver’s superview is not nil, this method releases the receiver. If you plan to reuse the view, be sure to retain it before calling this method and be sure to release it as appropriate when you are done with it or after adding it to another view hierarchy.

Ios – Why masksToBounds = YES prevents CALayer shadow

Because shadow is an effect done outside the View, and that masksToBounds set to YES will tell the UIView not to draw anything that is outside itself.

If you want a roundedCorner view with shadow I suggest you do it with 2 views:

UIView *view1 = [[UIView alloc] init];
UIView *view2 = [[UIView alloc] init];

view1.layer.cornerRadius = 5.0;
view1.layer.masksToBounds = YES;
view2.layer.cornerRadius = 5.0;
view2.layer.shadowColor = [[UIColor blackColor] CGColor];
view2.layer.shadowOpacity = 1.0;
view2.layer.shadowRadius = 10.0;
view2.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
[view2 addSubview:view1];
[view1 release];

Best Answer

Related Solutions

Ios – How to remove all subviews

Ios – Why masksToBounds = YES prevents CALayer shadow

Related Topic