IOS - how to create a “material” matching a UIView with a shadow?

Question

I am trying to see if there is a way to create a UIView with shadow behavior compatible with material design . I understand that the shadow becomes more intense as the object is removed from the background surface.

I can manually add a shadow like this, but this shadow does not calculate how intense the shadow should be (based on the Z order).

    button.layer.shadowPath = [UIBezierPath bezierPathWithRoundedRect:button.layer.bounds cornerRadius:11].CGPath;
    button.layer.shadowOpacity = 1.0;
    button.layer.shadowOffset = CGSizeMake(1,1);
    button.layer.shadowColor = [UIColor blackColor].CGColor;

How to create a UIView that will act like a Google material design? I found this example called Material Kit , however it just hides the touch shadow

One of the ways Google does this is by emphasizing the use of the 'z-axis to create a sense of depth in which elements can occupy different levels. . To show that the element is at a higher level along the z axis, the shadows around its border are used, go to the level below. This creates the illusion of an interactive layer / element that exists above another, lower interactive layer / element.

Answer 1

You can subclass UIButtonand first set the shadow properties to your liking:

button.layer.shadowOffset = CGSizeMake(0, 1);
button.layer.shadowRadius = 5;
button.layer.shadowOpacity = 0;

Then change the property shadowOpacitywhen the highlighted state changes:

- (void)setHighlighted:(BOOL)highlighted
{
    [super setHighlighted:highlighted];
    self.layer.shadowOpacity = (highlighted ? 0.85 : 0);
}

Answer 2

, , 2 . , masksToBounds.

2 UIViews. , masksToBounds = false. , masksToBounds = true.

, Apple masksToBounds clipsToBounds.