这个效果是我参考微信读书做的,给了我实现这个动画的灵感。
这个动画的原理也应该很容易能看出来:
1、动画开始前,两个叠在一起的view,上面一层是书本的封面,下面一层是书的第一页。
2、开始动画时,封面会进行两个动画,一个是缩放动画,一个是旋转动画(绕Y轴旋转90度);书页仅执行缩放动画。
3、结束动画时,封面view离开了屏幕,书页全屏展示。
接下来,只需要实现UINavigationControllerDelegate,传入一个遵循UIViewControllerAnimatedTransitioning这个协议的id类型对象就可以了。
- (nullable id <UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController
animationControllerForOperation:(UINavigationControllerOperation)operation
fromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC NS_AVAILABLE_IOS(7_0);
下面是这个对象的实现,核心的动画部分就是我上面提到的思路。
+ (id<UIViewControllerAnimatedTransitioning>)objectWithBookCoverView:(__kindof UIView *)bookCoverView animationControllerForOperation:(UINavigationControllerOperation)operation {
RCYBookAnimatorObject *object = [[RCYBookAnimatorObject alloc] init];
object.bookCoverView = bookCoverView;
object.operation = operation;
return object;
}
- (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext {
return 0.8;
}
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext {
UIView *containerView = [transitionContext containerView];
CATransform3D transform = CATransform3DIdentity;
transform.m34 = -1.0 / 500.0;
[containerView.layer setSublayerTransform:transform];
NSTimeInterval duration = [self transitionDuration:transitionContext];
switch (self.operation) {
case UINavigationControllerOperationPush: {
UIView *currentToView = [transitionContext viewForKey:UITransitionContextToViewKey];
//toView 和 fromView 都用截图
UIView *toView = [currentToView snapshotViewAfterScreenUpdates:YES];
UIView *fromView = [self.bookCoverView snapshotViewAfterScreenUpdates:NO];
[containerView addSubview:toView];
[containerView addSubview:fromView];
CGRect toViewFrame = toView.frame;
CGRect fromViewFrame = self.bookCoverView.frame;
fromView.layer.anchorPoint = CGPointMake(0, 0.5);
fromView.frame = fromViewFrame;
toView.frame = fromViewFrame;
[UIView animateKeyframesWithDuration:duration
delay:0.0
options:0
animations:^{
fromView.layer.transform = CATransform3DMakeRotation(-M_PI_2, 0, 1, 0);
toView.frame = toViewFrame;
fromView.frame = toViewFrame;
} completion:^(BOOL finished) {
[fromView removeFromSuperview];
[toView removeFromSuperview];
[containerView addSubview:currentToView];
[containerView.layer setSublayerTransform:CATransform3DIdentity];
[transitionContext completeTransition:![transitionContext transitionWasCancelled]];
}];
break;
}
case UINavigationControllerOperationPop: {
UIViewController *toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
UIViewController *fromVC = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIView *currentFromView = [transitionContext viewForKey:UITransitionContextFromViewKey];
//toView 和 fromView 都用截图
UIView *toView = [self.bookCoverView snapshotViewAfterScreenUpdates:YES];
UIView *fromView = [currentFromView snapshotViewAfterScreenUpdates:NO];
[containerView addSubview:fromView];
[containerView addSubview:toView];
[containerView insertSubview:toVC.view atIndex:0];
fromVC.view.hidden = YES;
CGRect toViewFrame = self.bookCoverView.frame;
CGRect fromViewFrame = fromView.frame;
toView.layer.anchorPoint = CGPointMake(0, 0.5);
fromView.frame = fromViewFrame;
toView.frame = fromViewFrame;
toView.layer.transform = CATransform3DMakeRotation(-M_PI_2, 0, 1, 0);
[UIView animateKeyframesWithDuration:duration
delay:0.0
options:0
animations:^{
toView.layer.transform = CATransform3DIdentity;
fromView.frame = toViewFrame;
toView.frame = toViewFrame;
} completion:^(BOOL finished) {
[fromView removeFromSuperview];
[toView removeFromSuperview];
[containerView.layer setSublayerTransform:CATransform3DIdentity];
[transitionContext completeTransition:![transitionContext transitionWasCancelled]];
if ([transitionContext transitionWasCancelled]) {
fromVC.view.hidden = NO;
[toVC.view removeFromSuperview];
}
}];
break;
}
default:
break;
}
}