To add this component to your Xcode project using CocoaPods, add the following to your Podfile
:
pod 'MaterialComponents/MaskedTransition'
Then, run the following command:
pod install
A masked transition is a UIViewController transition that can be used to present a contextual expansion from a circular source view. This transition follows the motion timing defined by the section on Radial transformations in the Material Design guidelines.
Before using Masked Transition, you'll need to import it:
import MaterialComponents.MaterialMaskedTransition
#import "MaterialMaskedTransition.h"
Create an instance of MDCMaskedTransition and assign it to the view controller's mdm_transitionController.transition
property prior to presenting the view controller:
vc.transitionController.transition = MDCMaskedTransition(sourceView: button) present(vc, animated: true)
vc.mdm_transitionController.transition = [[MDCMaskedTransition alloc] initWithSourceView:button]; [self presentViewController:vc animated:YES completion:nil];
You can customize the presented frame of the view controller by assigning a calculateFrameOfPresentedView
block on the transition instance. For example, to present a modal dialog centered in the screen you can use the following examples:
let transition = MDCMaskedTransition(sourceView: button) transition.calculateFrameOfPresentedView = { info in let size = CGSize(width: 200, height: 200) return CGRect(x: (info.containerView!.bounds.width - size.width) / 2, y: (info.containerView!.bounds.height - size.height) / 2, width: size.width, height: size.height) } vc.transitionController.transition = transition present(vc, animated: true)
MDCMaskedTransition *transition = [[MDCMaskedTransition alloc] initWithSourceView:button]; transition.calculateFrameOfPresentedView = ^(UIPresentationController *info) { CGSize size = CGSizeMake(200, 200); return CGRectMake((info.containerView.bounds.size.width - size.width) / 2, (info.containerView.bounds.size.height - size.height) / 2, size.width, size.height); }; vc.mdm_transitionController.transition = transition; [self presentViewController:vc animated:YES completion:nil];