什么也不说了,作为一名乐于分享技术的小开发,直接先上个样式最为直观贴切,有需要的朋友可以直接拿过去用。

需要demo请点击这里 :github

在这个demo中,核心为选用画布CAShapeLayer,因为一般都是用它来处理形状之类的动画,结合了贝塞尔曲线来控制路径,然后使用CABasicAnimation核心动画来产生所有效果。

首先封装一个自定义的动画。
///动画自定义封装
-(void)animationWithView:(UIView *)view{
    //1.创建layer
    CAShapeLayer *layer = [[CAShapeLayer alloc]init];
    
    //2.创建贝塞尔路径(参数为圆的外接矩形)
    //间距
    CGFloat margin = 20;
    //半径
    CGFloat radius = 25;
    //屏幕尺寸
    CGFloat viewWidth = [UIScreen mainScreen].bounds.size.width;
    //屏幕高度
    CGFloat viewHeight = [UIScreen mainScreen].bounds.size.height;
    //屏幕对角线
    CGFloat endRadius =sqrt(viewHeight*viewHeight +viewWidth*viewWidth);
    
    //起始路径
    CGRect startRect = CGRectMake(viewWidth-2*radius-margin, margin, radius*2, radius*2);
    UIBezierPath *startPath = [UIBezierPath bezierPathWithOvalInRect:startRect];
    //终止路径
    UIBezierPath *endPath = [UIBezierPath bezierPathWithOvalInRect:CGRectInset(startRect, -endRadius, -endRadius) ];
    
    //3.设置贝塞尔属性
    //填充颜色
    layer.fillColor = [UIColor redColor].CGColor;
    //4.将贝塞尔作为layer的路径
    layer.path = startPath.CGPath;
    //将layer作为父视图的遮罩图层.
    view.layer.mask = layer;
    //5.将path添加到视图中
    //[self.view.layer addSublayer:layer];
    
    //使用核心动画实现
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"path"];
    //这个属性是判断是动画之前还是动画之后的。
    if (self.isPresent) {
        animation.fromValue = (__bridge id _Nullable)(startPath.CGPath);
        animation.toValue = (__bridge id _Nullable)(endPath.CGPath);
    }else{
        animation.fromValue = (__bridge id _Nullable)(endPath.CGPath);
        animation.toValue = (__bridge id _Nullable)(startPath.CGPath);
    }
    animation.delegate = self;
    
    //设置动画属性
    animation.fillMode = kCAFillModeForwards;
    
    animation.duration = 2;
    
    animation.removedOnCompletion = NO;
    
    //添加动画到图层
    [layer addAnimation:animation forKey:nil];
}

! 这里要注意这个mask的属性,设置之后就不需要再额外的add进去,它是一种用于遮罩视图的效果,并且设置的颜色会失效

在这个动画中,有三个重要的属性,号称“转场三剑客”。

UIViewControllerAnimatedTransitioning,主要负责转场的动画时间和动画具体内容。

#pragma mark - UIViewControllerAnimatedTransitioning
///转场动画时间
- (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext{
    return 2;
}
///转场动画的内容
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext{
    
    //1.获取上下文的容器视图
    UIView *containerView = transitionContext.containerView;
    //2.获取目标视图
    UIView *fromView = [transitionContext viewForKey:UITransitionContextFromViewKey];
    UIView *toView = [transitionContext viewForKey:UITransitionContextToViewKey];
    
    //3.将目标视图添加到容器视图
    UIView *aniView = self.isPresent?toView:fromView;
    
    [containerView addSubview:aniView];
    
    //4.开始动画
    [self animationWithView:aniView];
    
    
    
    self.context = transitionContext;
}

CAAnimationDelegate,主要负责监控动画开始和动画结束之后。

#pragma mark - CAAnimationDelegate
///动画开始
- (void)animationDidStart:(CAAnimation *)anim{
    
} ///每次动画结束调用
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
    //5.告诉上下文完成转场,否则上下文将会一直等待系统通知是否完成.
    [self.context completeTransition:YES];
}

UIViewControllerTransitioningDelegate,主要负责告诉系统由哪个控制器提供转场,哪个控制器来解除转场。

#pragma mark - UIViewControllerTransitioningDelegate
///告诉由谁提供转场
- (nullable id <UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source{
    
    self.isPresent = YES;
    return self;
}
///由谁解除转场
- (nullable id <UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)dismissed{
    
    self.isPresent = NO;
    return self;
}

最后只需要在需要转场的控制器中使用这个封装的类即可

-(void)awakeFromNib{
    [super awakeFromNib];
    
    //1.设置跳转样式
    self.modalPresentationStyle = UIModalPresentationCustom;
    //2.设置代理
    self.animation = [[JanCustomAnimation alloc]init];
    
    self.transitioningDelegate = self.animation;
} -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    [self dismissViewControllerAnimated:YES completion:nil];
}

需要注意的是设置样式和代理,必须要优先于viewdidload之前设置,因为这里涉及到控制器的生命周期的问题

好了,到这里就可以实现完整的自定义转场的酷炫效果了。

iOS | CAShapeLayer转场动画的更多相关文章

  1. iOS 自定义转场动画浅谈

    代码地址如下:http://www.demodashi.com/demo/11612.html 路漫漫其修远兮,吾将上下而求索 前记 想研究自定义转场动画很久了,时间就像海绵,挤一挤还是有的,花了差不 ...

  2. iOS 自定义转场动画

    代码地址如下:http://www.demodashi.com/demo/12955.html 一.总效果 本文记录分享下自定义转场动画的实现方法,具体到动画效果:新浪微博图集浏览转场效果.手势过渡动 ...

  3. iOS自定义转场动画实战讲解

    iOS自定义转场动画实战讲解   转场动画这事,说简单也简单,可以通过presentViewController:animated:completion:和dismissViewControllerA ...

  4. VCTransitionsLibrary –自定义iOS交互式转场动画的库

    简介 VCTransitionsLibrary 提供了许多适用于入栈,出栈,模态等场景下控制器切换时的转场动画.它本身提供了一个定义好的转场动画库,你可以拖到自己工程中直接使用;也提供了许多拥有不同转 ...

  5. iOS 开发--转场动画

    "用过格瓦拉电影,或者其他app可能都知道,一种点击按钮用放大效果实现转场的动画现在很流行,效果大致如下:" 本文主讲SWIFT版,OC版在后面会留下Demo下载 在iOS中,在同 ...

  6. iOS自定义转场动画的实现

    iOS中熟悉的是导航栏中的push和pop这两种动画效果,在这里我们可以自己实现自己想要的一些转场动画 下面是我自己创建转场动画的过程 1.新建一个文件继承自NSObject ,遵循协议UIViewC ...

  7. ios图层转场动画

    动画类型 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果.iOS比Mac OS X的转场动画效果少一点 UINavigationController就是通过CA ...

  8. iOS之UI--转场动画

    1.什么是转场动画?    就是从一个场景转换到另一个场景,像导航控制器的push效果,就是一个转场.    2.如何创建转场动画    创建转场动画    CATransition *anim = ...

  9. iOS之转场动画

    CodeApp地址CATransition_Demo:https://github.com/Wheat-Qin/CATransition_Demo iOS中比较全的翻转过渡动画(不只是苹果提供的).包 ...

随机推荐

  1. DJango小总结一

    views.py                        def func(request):                # 包含所有的请求数据                ...     ...

  2. IDEA安装及破解永久版教程————鹏鹏

    ---恢复内容开始--- 首先我们先来介绍下什么是IDEA? IDEA 全称 IntelliJ IDEA,是java编程语言开发的集成环境.IntelliJ在业界被公认为最好的java开发工具之一,尤 ...

  3. sql注入一点小心得

    好久没写技术博客,最近研究产品关于用户体验方面较多,加上项目突然比较多,设计原型.跟进开发.设计师等工作着实没时间写博客. 接下来技术上主要php深入学习和mysql优化.这两天看了关于sql注入方面 ...

  4. Android 自定义圆形图表

    <com...SignChartView android:id="@+id/signChart" android:layout_width="265dp" ...

  5. matlab练习程序(多线段交点)

    很简单的算法,这里是把每对线段都进行比较了. 还有一种似乎先通过x和y排序再进行交点判断的,不过那种方法我还没看太明白. 这里的方法如下: 1.根据线段的端点求两条直线的交点. 2.判断直线的交点是否 ...

  6. matlab练习程序(Arnold图像置乱)

    自从上次写了Hilbert图像置乱之后,就对图像置乱研究了一下,发现这里面也是有很多置乱算法的. Arnold也算一种比较主要的置乱算法,算法由以下变换公式产生: 这里a和b是参数,n是迭代次数,N是 ...

  7. 【转】python安装库

    1.打开网址https://pypi.python.org/pypi/numpy,找到安装的python版本对应的numpy版本. 我的python版本是 下载的对应numpy版本是 2.将numpy ...

  8. 一个.java源文件中可以有多个类吗?(内部类除外)有什么条件?

    一个.java源文件中可以有多个类吗?(内部类除外)有什么条件?带着这个疑惑,动手建几个测试类, 揭开心中的疑惑.以下是解开疑惑过程: package test;/** * 一个.java源文件中可以 ...

  9. 【NLP_Stanford课堂】语言模型1

    一.语言模型 旨在:给一个句子或一组词计算一个联合概率 作用: 机器翻译:用以区分翻译结果的好坏 拼写校正:某一个拼错的单词是这个单词的概率更大,所以校正 语音识别:语音识别出来是这个句子的概率更大 ...

  10. vue+node+mongodb实现的功能

    用vue+node +mongodb实现前后台交互的页面代码,已经上传到github上, 地址是: https://github.com/GainLoss/vue-node-mongodb https ...