核心动画中的动画组和转场动画

CALayer与iOS动画 讲解及使用 iOS CALayer与iOS动画 讲解及使用 关于CoreAnimation 初识CALayer CALayer CAAnimation CAMediaTiming UIView与CALayer动画原理 UIView动画实现原理 展示层presentationLayer和模型层modelLayer 初探CALayer属性 CALayer的探究应用进度条 常规做法 自定义layer 扩展 1stro 阅读详情

动画组 CAAnimationGroup


上篇博客http://blog.youkuaiyun.com/cocoarannie/article/details/10413301介绍了核心动画中的基本动画(CABasicAnimation)和关键帧动画(CAKeyframeAnimation),还有一个比较常用的就是动画组(CAAnimationGroup)

所谓的动画组就是将一些动画组合起来给layer使其的动画更丰富灵活。
它很简单,就是为其animations属性赋值一个动画数组。

- (void)demoAnimationGroup
{
    static NSString * const kCAPostionKeyPath = @"position";
    static NSString * const kCAOpacityKeyPath = @"opacity";
    static NSString * const kCARotationKeyPath = @"transform.rotation";
    static NSString * const kCAScaleKeyPath = @"transform.scale";
    
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:_demoView.layer.position];
    [path addCurveToPoint:CGPointMake(260, 400) controlPoint1:CGPointMake(0, 460) controlPoint2:CGPointMake(320, 0)];
    
    //路径动画
    CAKeyframeAnimation *posAnimation = [CAKeyframeAnimation animationWithKeyPath:kCAPostionKeyPath];
    posAnimation.path = path.CGPath;
    posAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    
    //透明度动画
    CABasicAnimation *opaAnimation = [CABasicAnimation animationWithKeyPath:kCAOpacityKeyPath];
    opaAnimation.duration = 2.0f;
    opaAnimation.toValue = @(0.3f);
    opaAnimation.autoreverses = YES;
    
    //旋转动画
    CABasicAnimation *rotAnimation = [CABasicAnimation animationWithKeyPath:kCARotationKeyPath];
    rotAnimation.duration = 2.0f;
    rotAnimation.toValue = @(M_PI);
    rotAnimation.autoreverses = YES;
    
    //缩放动画
    CABasicAnimation *scaAnmaiton = [CABasicAnimation animationWithKeyPath:kCAScaleKeyPath];
    scaAnmaiton.duration = 2.0f;
    scaAnmaiton.toValue = @(1.5f);
    scaAnmaiton.autoreverses = YES;
    
    //设置动画组
    CAAnimationGroup *group = [CAAnimationGroup animation];
    group.animations = @[posAnimation, opaAnimation, rotAnimation, scaAnmaiton];
    group.duration = 4.0f;
    group.removedOnCompletion = NO;
    group.fillMode = kCAFillModeForwards;
    
    [_demoView.layer addAnimation:group forKey:nil];
}

这个动画组对demoView的layer加入了一些同时进行的动画,比如双控制点的贝塞尔路径,透明度的渐隐渐明,旋转以及缩放等。


CATransition


转场动画几乎在所有的APP上都能遇见,经常用于视图控制器的切换或者单视图控制器的页面切换等,也可以在自定义UIStoryboardSegue中来加入动画效果。

它也是CAAnimation的子类,能为图层提供移出屏幕和移入的动画效果。
其常用属性为

type 过渡类型
subtype 过渡类型的子类型,方向设置

其中过渡类型有很多,最初有四个版本,后来又加入了一些,以字符串形式设置。

最初的四个:fade,push,moveIn,reveal
以后加入的效果则更加丰富和炫目,有 cube, oglFlip, suckEffect, rippleEffect, pageCurl, pageUnCurl, cameraIrisHollowOpen, cameraIrisHollowClose。

- (void)viewTransition
{
    static NSString * const kCATransitionTypeFlip = @"oglFlip";     //翻页效果
    
    CATransition *transition = [CATransition animation];
    transition.type = kCATransitionTypeFlip;
    transition.subtype = kCATransitionFromRight;
    transition.duration = 1.5f;
    [_transitionOrangeView.layer addAnimation:transition forKey:nil];
    
    [self.view performSelector:@selector(sendSubviewToBack:) withObject:_transitionOrangeView afterDelay:1.0f];
}

这个方法简单的实现了view翻页的效果,当然目前控制器的根view只有一个subview,所以使用sendSubviewToBack的方法后显示的还是这个view,但是看到了动画效果。

现在UIView的转场动画有了更方便的类方法
+ transitionWithView:duration:options:animations:completion:
+ transitonFromView:toView:duration:options:completion:

这两个方法参数加入了苹果推荐的块代码,也让转场动画都在一个方法中进行处理,也对动画结束进行了处理,更加方便易用。

- (void)anotherTransition
{
    _transitionBlueView = [[UIView alloc] initWithFrame:self.view.bounds];
    _transitionBlueView.backgroundColor = [UIColor blueColor];
    
    [UIView transitionFromView:_transitionOrangeView
                        toView:_transitionBlueView
                      duration:1.0f
                       options:UIViewAnimationOptionTransitionCrossDissolve   
                    completion:nil];
}

代码很简洁和易读。
不过要注意的一点是,这里的参数并不是很多,而且我并没有对蓝色视图通过addSubview加载到self.view中,也没有对橘色视图进行removeFromSuperview,这些方法都封装在这个类方法中隐式进行了。


Demo示例点击打开链接




以上为本篇博客全部内容,欢迎指正和交流。转载请注明出处~
threejs添加点击事件(给楼宇扫描效果加上点击事件) threejs、webgl、shader、3D、光墙效果。使用shader实现楼宇扫描效果并添加点击选中效果,three.js添加点击事件 阅读详情

相关推荐

相机转场效果

相机转场的各种效果,u3D,适合用于关卡切换,场景过度等。

threejs中使用补间动画tween.js实现相机的转场动画效果

tween补间动画实现模型的转场动画效果

weixin_44870969的博客 736

3D 签到墙 ThreeJS动画

原资源链接:http://www.jq22.com/jquery-info16193,可以在线演示查看

tweenjs-实现threejs的转场动画(基于vue)

注意!文章主讲tweenjs的使用,省去了threejs部分的代码,请自行添加! 参考博文 链式补间:tween.chain 如果有多组补间动画,想要a组动画结束后立即启动b组动画,则需要使用tweena.chain(tweenb) 效果图: 1、引入tweenjs import * as TWEEN from '@/assets/js/Tween' 2、使用 <el-button @click="action">开始运动</el-button> data: p1: { x:

string佳佳的博客 2080

编译CycloneDDS和CycloneDDS-CXX踩过的坑——CMake Error at CMakeLists.txt:227 (find_package):

最近编译CycloneDDS和CycloneDDS-CXX踩了两个坑,花了不少时间。做个简单的记录,免得以后又踩到。注意:CycloneDDS-CXX编译依赖CycloneDDS,因此必须先编译CycloneDDS需要严格按照步骤进行,否则要入坑步骤如下,1先编译CycloneDDS以上步骤完成CycloneDDS的编译和安装,生成的bin include lib等位于install目录下面。

usstmiracle的博客 1900

为什么你的Mac蓝牙总断连?深入解析硬件干扰与系统设置避坑

本文深入解析Mac蓝牙频繁断连的原因,包括硬件干扰(如WiFi同频干扰、USB设备电磁干扰)和系统设置问题,并提供详细的优化方案和诊断工具(如blueutil)使用指南,帮助用户有效解决蓝牙稳定性问题。

ik67890123的博客 679

three.js能实现啥效果?看过来,这里都是它的菜(01)

经常有老铁问我,这里炫酷效果是如何实现的,还有问我想实现什么效果怎么办,甚至还有想实现动态效果,但是描述不出来的。好吧,统统满足老铁们呢,本期开始分享three.js效果图,并附带简要简介,无源码。旋转+放射+流边动画本次是第一期,后面会陆续和小伙们分享,动画效果越多,相应的也就越是复杂。

2401_82943878的博客 910

软件测试工程师笔试题

这里写目录标题全套软件测试面试笔试题(附答案)二、选折三、添空四、简答(资料是搜集整理的,感谢前辈的解题)无1.区别阶段评审的与同行评审2.什么是软件测试3. 简述集成测试的过程4 怎么做好文档测试5 白盒测试有几种方法6 系统测试计划是否需要同行审批,为什么7Alpha 测试与 beta 的区别8 比较负载测试,容量测试和强度测试的区别。性能测试从使用方便的角度来说,9 测试结束的标准是什么?10 描述软件测试活动的生命周期?11 软件的缺陷等级应如何划分? 软件测试工程师笔试题(附答案) 全套软件测试面

m0_46446002的博客 2548

Core Animation(核心动画)的基本介绍与使用

Core Animation简介 Core Animation,中文翻译为核心动画,它是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍。也就是说,使用少量的代码就可以实现非常强大的功能。 Core Animation可以用在Mac OS X和iOS平台。 Core Animation的动画执行过程都是在后台操作的,不会阻塞主线程。 要注意的是,Core Animat

码虫儿 1651

python 常见算法(1-50题)

常见的算法题

weixin_58470558的博客 1755

【嵌入式原理系列-第七篇】ld脚本实战:从零构建MCU内存布局

本文是一篇针对嵌入式开发者的实战指南,详细讲解了如何从零开始为MCU编写ld链接器脚本以构建自定义内存布局。文章以STM32F103C8T6为例,深入剖析了MEMORY和SECTIONS指令的用法,并提供了OTA分区、非易失数据存储等高级定制案例,帮助开发者解决实际工程中的Flash与RAM管理难题,实现对程序运行的深度掌控。

weixin_29271263的博客 246

IOS 动画专题 --iOS核心动画

    iOS开发系列--让你的应用“动”起来 --iOS核心动画 概览 通过核心动画创建基础动画、关键帧动画、动画组、转场动画,如何通过UIView的装饰方法对这些动画操作进行简化等。在今天的文章里您可以看到动画操作在iOS中是如何简单和高效,很多原来想做但是苦于没有思路的动画在iOS中将变得越发简单: CALayer CALayer简介  CALayer常用...

weixin_33785972的博客 141

Android Termux 安装Kali Linux 或 kali Nethunter史诗级详细教程

Termux 安装kali

风云小虾米的博客 6万+

iOS 核心动画

核心动画: 在iOS中核心动画分为几类:基础动画、关键帧动画、动画组、转场动画 各个类的关系如我的截图 CAAnimation:核心动画的基础类,不能直接使用,负责动画运行时间、速度的控制,本身实现了CAMediaTiming协议。 CAPropertyAnimation:属性动画的基类(通过属性进行动画设置,注意是动画属性),不能直接使用。 CABasicAn...

weixin_30437337的博客 79

华为OD机试真题 C 实现【水库蓄水问题】【2022.11 Q4 新题】

给定一个长度为 n 的整数数组height。数组的元素表示山的高度,选择两个元素作为水库的边界,求蓄水量的最大值并输出蓄水量最大时的边界下标(蓄水量相同时输出下标较近的)。

MISAYAONE的博客 1万+

YOLOv11改进 | 注意力篇 | YOLOv11引入24年ECCV的自调制特征聚合注意力模块(SMFA),并构建C2PSA_SMFA

1.SMFA介绍1.1 摘要:基于Transformer的图像复原方法由于Transformer的自注意(self-attention,SA)特性能够更好地挖掘非局部信息,从而获得更好的高分辨率图像重建效果,因此具有重要的应用价值。然而,关键点积SA需要大量的计算资源,这限制了其在低功耗器件中的应用。此外,模拟退火机制的低通特性限制了其捕获局部细节的能力,从而导致平滑的重建结果。

tsg6698的博客 952

iOS 核心动画 Core Animation浅谈

代码地址如下:http://www.demodashi.com/demo/11603.html 前记 关于实现一个iOS动画,如果简单的,我们可以直接调用UIView的代码块来实现,虽然使用UIView封装的方法很方便,但是这只能用于一些简答的动画,如果是一些复杂的动画呢?这就不得不去研究下核心动画Core Animation(包含在Quartz Core框架中)了。这这之前我们必须了解,CA...

weixin_33989058的博客 74

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

"MindManager"学习iOS系列之"CAAnimation-核心动画"详解,让你的应用“动”起来。

"MindManager"学习iOS系列之"CAAnimation-核心动画"详解,思维导图内展示了CAAnimation-核心动画的大多数基本功能和知识,每个part都有代码讲解,展示出CAAnimation-核心动画的清晰轮廓,编者提供了"JPG"、"SWF"、"PDF"、"Word"、"Mmap"格式的源文件供给使用。注意:JPG格式仅为图片总览,SWF格式使用微软IE浏览器浏览即...

148

华为的C语言编程规范.pdf

华为技术有限公司内部技术规范。本规范制定了编写C语言程序的基本原则、规则和建议。从代码的清晰、简洁、可测试、安全、程序效率、可移植各个方面对C语言编程作出了具体指导。

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

iOS开发系列--让你的应用“动”起来

--iOS核心动画 概览 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看到iOS中如何使用图层精简非交互式绘图,如何通过核心动画创建基础动画、关键帧动画、动画组、转场动画,如何通过UIView的装饰方法对这些动画操作进行简化等。在今天的文章里您可以看到动画操作在iOS中是如何简单和高效,很多原来想做但是苦于没有思路的动

zhongmin_li的博客 405

基础动画

在iOS中核心动画分为几类:基础动画(CABasicAnimation)、关键帧动画(CAKeyframeAnimation)、动画组(CAAnimationGroup)、转场动画(CATransition) CAAnimation:核心动画的基础类,不能直接使用,负责动画运行时间、速度的控制,本身实现了CAMediaTiming协议。 CAPropertyAnimatio...

weixin_30338481的博客 90
上一篇: CAAnimation——基本动画,关键帧动画和贝塞尔路径
下一篇: IOS网络编程基础——GET 以及 POST
RannieR
博客等级 码龄14年 180粉丝 68原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值