Material Design

Shadow elevations

A shadow elevation specifies the degree of shadow intensity to be displayed beneath an object. Higher shadow elevations have greater shadow intensities, akin to raising an object above a surface resulting in a more prominent, albeit more diffuse, shadow. This component provides commonly used Material Design elevations for components.

Shadows

Design & API Documentation


Installation

Installation with CocoaPods

To add this component to your Xcode project using CocoaPods, add the following to your Podfile:

pod 'MaterialComponents/ShadowElevations'

Then, run the following command:

pod install

Usage

Importing

Before using Shadow Elevations, you’ll need to import it:

Swift

import MaterialComponents

class ShadowedView: UIView {

  override class var layerClass: AnyClass {
    return MDCShadowLayer.self
  }

  var shadowLayer: MDCShadowLayer {
    return self.layer as! MDCShadowLayer
  }

  func setDefaultElevation() {
    self.shadowLayer.elevation = .cardResting
  }

}

Objective-C

#import "MaterialShadowElevations.h"

@interface ShadowedView: UIView

@end

@implementation ShadowedView

+ (Class)layerClass {
  return [MDCShadowLayer class];
}

- (MDCShadowLayer *)shadowLayer {
  return (MDCShadowLayer *)self.layer;
}

- (void)setDefaultElevation {
  self.shadowLayer.elevation = MDCShadowElevationCardResting;
}

@end