好久没更新自己的简书了,悲哀呀...
先来个效果图吧
transformAimationGif.gif
-
先拽两个控制器, 蓝色关联PushViewController, 浅黄色关联PopViewController,如图:
图1.png
-
关联属性于Push
图2.png
-
做过自定义转场动画的同学们应该都晓得必须遵守<UIViewControllerAnimatedTransitioning>协议,那么这里就创建一个类(CustomPushTransition)专门来实现此转场效果.在.m必须实现这两个方法:
- (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext; - (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext -
代码如下, 大致思想:创建两个圆(利用贝尔曲线),一个是与push按钮的size, 另一个是有足够覆盖屏幕的半径,最后的动画是由这两个的path来完成.
@property (nonatomic, strong) id<UIViewControllerContextTransitioning>customTransitionContext; - (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext{ return .5f; } - (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext{ self. PushViewController *fromVC = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey]; PopViewController *toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey]; //获取push控制器中按钮. UIButton *button = fromVC.push; //获取容器 UIView *containerView = [transitionContext containerView]; //添加视图 [containerView addSubView:fromVC.view]; [containerView addSubView:toVC.view]; //绘制小圆, Oval:椭圆形 UIBezierPath *startBP = [UIBezierPath bezierPathWithOvalInRect:button.frame]; //绘制大圆, 需先确定半径,其实这里用到勾股定理,很好理解的,如图3: CGFloat horizontalSide_X = button.center.x; CGFloat verticalSide_Y = CGRectGetMaxY(toVC.view.bounds) - button.center.y; CGFloat radius = sqrt( (horizontalSide_X * horizontalSide_X) + (verticalSide_Y * verticalSide_Y) ); /* CGRect CGRectInset ( CGRect rect, CGFloat dx, CGFloat dy ); 解释: 该结构体是以rect的中点为中心,插入一个以dx,dy为参考的放大或缩小的矩形; 正表示缩小,负表示放大. 所以绘制大圆是以小圆(button.frame)为中心点,插入一个radius尺寸的放大的圆 */ UIBezierPath *finalBP = [UIBezierPath bezierPathWithOvalInRect:CGRectInset(button.frame, -radius, -radius)]; CAShapeLayer *maskLayer = [CAShapeLayer layer]; maskLayer.path = finalBP.CGPath; //设置目标控制器的mask toVC.view.layer.mask = maskLayer; //执行动画 CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"path"]; animation.fromValue = (__bridge id _Nullable)(startBP.CGPath); animation.toValue = (__bridge id _Nullable)(finalBP.CGPath); animation.during = [self transitionDuration:transitionContext]; animation.timingFuncion = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; animation.delegate = self; [maskLayer addAnimation:maskLayerAnimation forKey:@"path"]; }pragma mark - CABasicAnimation
-
(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
//告诉系统转场动画完成
[self.customTransitionContext completeTransition:![self.customTransitionContext transitionWasCancelled]];
//清除相应控制器视图的mask
[self.customTransitionContext viewControllerForKey:UITransitionContextFromViewControllerKey].view.layer.mask = nil;
[self.customTransitionContext viewControllerForKey:UITransitionContextToViewControllerKey].view.layer.mask = nil;
}
图3.png
-
5. push的自定义转场基本完成了,现在回到PushViewController上, 控制器须遵守<UINavigationControllerDelegate>协议, 所以self.navigationCtroller.delegate = self; //注意设置导航控制器的代理须写在viewWillAppear中或是viewDidAppear.实现导航控制器的代理:
#pragma mark - UINavigationControllerDelegate
- (id<UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController animationControllerForOperation:(UINavigationControllerOperation)operation fromViewController:(UIViewController *)fromVC toViewController:(UIViewController *)toVC{
if (operation == UINavigationControllerOperationPush) {
return self.pushAnimation;
}
return nil;
}
#pragma mark - 懒加载
- (CustomPushTransition *)pushAnimation{
if (!_pushAnimation) {
_pushAnimation = [[CustomPushTransition alloc] init];
}
return _pushAnimation;
}