CABasicAnimation使用总结

最新推荐文章于 2024-04-11 01:36:21 发布
最新推荐文章于 2024-04-11 01:36:21 发布
阅读量215 收藏
点赞数
文章标签： python
原文链接：https://my.oschina.net/u/1763048/blog/632194
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

实例化

使用方法animationWithKeyPath:对 CABasicAnimation进行实例化，并指定Layer的属性作为关键路径进行注册。

//围绕y轴旋转CABasicAnimation *transformAnima = [CABasicAnimation animationWithKeyPath:@"transform.rotation.y"];
duration动画的时长
repeatCount重复的次数。不停重复设置为 HUGE_VALF
repeatDuration设置动画的时间。在该时间内动画一直执行，不计次数。
beginTime指定动画开始的时间。从开始延迟几秒的话，设置为【CACurrentMediaTime() + 秒数】 的方式
timingFunction设置动画的速度变化
autoreverses动画结束时是否执行逆动画
fromValue所改变属性的起始值
toValue所改变属性的结束时的值
byValue所改变属性相同起始值的改变量


transformAnima.fromValue = @(M_PI_2);
transformAnima.toValue = @(M_PI);
transformAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transformAnima.autoreverses = YES;
transformAnima.repeatCount = HUGE_VALF;
transformAnima.beginTime = CACurrentMediaTime() + 2;
防止动画结束后回到初始状态

只需设置removedOnCompletion、fillMode两个属性就可以了。

transformAnima.removedOnCompletion = NO;
transformAnima.fillMode = kCAFillModeForwards;

解释：为什么动画结束后返回原状态？
首先我们需要搞明白一点的是，layer动画运行的过程是怎样的？其实在我们给一个视图添加layer动画时，真正移动并不是我们的视图本身，而是 presentation layer 的一个缓存。动画开始时 presentation layer开始移动，原始layer隐藏，动画结束时，presentation layer从屏幕上移除，原始layer显示。这就解释了为什么我们的视图在动画结束后又回到了原来的状态，因为它根本就没动过。

这个同样也可以解释为什么在动画移动过程中，我们为何不能对其进行任何操作。

所以在我们完成layer动画之后，最好将我们的layer属性设置为我们最终状态的属性，然后将presentation layer 移除掉。

添加动画
[self.imageView.layer addAnimation:transformAnima forKey:@"A"];

需要注意的两点

  • 一个 CABasicAniamtion 的实例对象只是一个数据模型，和他绑定到哪一个layer上是没有关系的

  • 方法addAnimation:forKey:是将 CABasicAniamtion 对象进行了 copy 操作的。所以在将其添加到一个layer上之后，我们还是将其再次添加到另一个layer上的。

fillMode属性的理解

该属性定义了你的动画在开始和结束时的动作。默认值是 kCAFillModeRemoved。

取值的解释

  • kCAFillModeRemoved 设置为该值，动画将在设置的 beginTime 开始执行（如没有设置beginTime属性，则动画立即执行），动画执行完成后将会layer的改变恢复原状。

07162408_qQHb.png

  • kCAFillModeForwards 设置为该值，动画即使之后layer的状态将保持在动画的最后一帧，而removedOnCompletion的默认属性值是 YES，所以为了使动画结束之后layer保持结束状态，应将removedOnCompletion设置为NO。

07162408_QmrC.png

  • kCAFillModeBackwards 设置为该值，将会立即执行动画的第一帧，不论是否设置了 beginTime属性。观察发现，设置该值，刚开始视图不见，还不知道应用在哪里。

07162408_BuCO.png

  • kCAFillModeBoth 该值是 kCAFillModeForwards 和 kCAFillModeBackwards的组合状态

07162409_z3Co.png

Animation Easing的使用

也即是属性timingFunction值的设定，有种方式来获取属性值

（1）使用方法functionWithName:

这种方式很简单，这里只是简单说明一下取值的含义：

  • kCAMediaTimingFunctionLinear 传这个值，在整个动画时间内动画都是以一个相同的速度来改变。也就是匀速运动。

  • kCAMediaTimingFunctionEaseIn 使用该值，动画开始时会较慢，之后动画会加速。

    07162409_buMT.png

  • kCAMediaTimingFunctionEaseOut 使用该值，动画在开始时会较快，之后动画速度减慢。

    07162409_v2Px.png

  • kCAMediaTimingFunctionEaseInEaseOut 使用该值，动画在开始和结束时速度较慢，中间时间段内速度较快。

    07162409_gRRg.png

(2)使用方法functionWithControlPoints: : : :实现，这个之后再说，占个坑先。
其他的一些设置属性

  • repeatCount 设置动画的执行次数

  • autoreverses 默认值为 NO，将其设置为 YES

  • speed 改变动画的速度 可以直接设置动画上的speed属性，这样只有这个动画速度。

    animation.speed = 2;

    或者在layer上设置speed属性，这样在该视图上的所有动画都提速，该视图上的所有子视图上的动画也会提速。
    speed两点需注意的：
    (1) 如果设置动画时间为4s，speed设置为2，则动画只需2s即可执行完。
    (2)如果同时设置了动画的speed和layer 的speed，则实际的speed为两者相乘。

使用总结

  • 在动画执行完成之后，最好还是将动画移除掉。也就是尽量不要设置removedOnCompletion属性为NO

  • fillMode尽量取默认值就好了，不要去设置它的值。只有在极个别的情况下我们会修改它的值，以后会说到，这里先占个坑。

  • 解决有时视图会闪动一下的问题，我们可以将layer的属性值设置为我们的动画最后要达到的值，然后再给我们的视图添加layer动画。

例子（移动动画实现）

直接上代码

CABasicAnimation *positionAnima = [CABasicAnimation animationWithKeyPath:@"position.y"];
positionAnima.duration = 0.8;
positionAnima.fromValue = @(self.imageView.center.y);
positionAnima.toValue = @(self.imageView.center.y-30);
positionAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
positionAnima.repeatCount = HUGE_VALF;
positionAnima.repeatDuration = 2;
positionAnima.removedOnCompletion = NO;
positionAnima.fillMode = kCAFillModeForwards;

[self.imageView.layer addAnimation:positionAnima forKey:@"AnimationMoveY"];
组合动画的实现
CABasicAnimation *positionAnima = [CABasicAnimation animationWithKeyPath:@"position.y"];
positionAnima.fromValue = @(self.imageView.center.y);
positionAnima.toValue = @(self.imageView.center.y-30);
positionAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];CABasicAnimation *transformAnima = [CABasicAnimation animationWithKeyPath:@"transform.rotation.y"];
transformAnima.fromValue = @(0);
transformAnima.toValue = @(M_PI);
transformAnima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];CAAnimationGroup *animaGroup = [CAAnimationGroup animation];
animaGroup.duration = 2.0f;
animaGroup.fillMode = kCAFillModeForwards;
animaGroup.removedOnCompletion = NO;
animaGroup.animations = @[positionAnima,transformAnima];

[self.imageView.layer addAnimation:animaGroup forKey:@"Animation"];
动画开始和结束时的事件

为了获取动画的开始和结束事件，需要实现协议

positionAnima.delegate = self;

代理方法实现

//动画开始时- (void)animationDidStart:(CAAnimation *)anim
{    NSLog(@"开始了");
}//动画结束时- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{    //方法中的flag参数表明了动画是自然结束还是被打断,比如调用了removeAnimationForKey:方法或removeAnimationForKey方法，flag为NO，如果是正常结束，flag为YES。
    NSLog(@"结束了");
}

其实比较重要的是有多个动画的时候如何在代理方法中区分不同的动画
两种方式

方式一：

如果我们添加动画的视图是全局变量，可使用该方法。
添加动画时，我们使用了

[self.imageView.layer addAnimation:animaGroup forKey:@"Animation"];

所以，可根据key来区分不同的动画

//动画开始时- (void)animationDidStart:(CAAnimation *)anim
{    if ([anim isEqual:[self.imageView.layer animationForKey:@"Animation"]]) {        NSLog(@"动画组执行了");
    }
}

Note:把动画存储为一个属性然后再回调中比较，用来判定是哪个动画是不可行的。应为委托传入的动画参数是原始值的一个深拷贝，不是同一个值

方式二

添加动画的视图是局部变量时，可使用该方法
添加动画给动画设置key-value对

[positionAnima setValue:@"PositionAnima" forKey:@"AnimationKey"];

[transformAnima setValue:@"TransformAnima" forKey:@"AnimationKey"];

所以，可以根据key中不同的值来进行区分不同的动画

//动画结束时- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{    if ([[anim valueForKey:@"AnimationKey"]isEqualToString:@"PositionAnima"]) {        NSLog(@"位置移动动画执行结束");
    }    else if ([[anim valueForKey:@"AnimationKey"]isEqualToString:@"TransformAnima"]){        NSLog(@"旋转动画执行结束");
    }
}
一些常用的animationWithKeyPath值的总结
transform.scale比例转化@(0.8)
transform.scale.x宽的比例@(0.8)
transform.scale.y高的比例@(0.8)
transform.rotation.x围绕x轴旋转@(M_PI)
transform.rotation.y围绕y轴旋转@(M_PI)
transform.rotation.z围绕z轴旋转@(M_PI)
cornerRadius圆角的设置@(50)
backgroundColor背景颜色的变化(id)[UIColor purpleColor].CGColor
bounds大小，中心不变[NSValue valueWithCGRect:CGRectMake(0, 0, 200, 200)];
position位置(中心点的改变)[NSValue valueWithCGPoint:CGPointMake(300, 300)];
contents内容，比如UIImageView的图片imageAnima.toValue = (id)[UIImage imageNamed:@"to"].CGImage;
opacity透明度@(0.7)
contentsRect.size.width横向拉伸缩放@(0.4)最好是0~1之间的



self.saomiao.layer.anchorPoint = CGPointMake(1,1);//以右下角为原点转，（0,0）是左上角转，（0.5,0,5）心中间转，其它以此类推 

/*

frame.origin.x = position.x - anchorPoint.x * bounds.size.width；  

frame.origin.y = position.y - anchorPoint.y * bounds.size.height；

*/

CABasicAnimation 按home键后台之后，取消再切回来动画就停止了   

 rotation.removedOnCompletion = false



转载于:https://my.oschina.net/u/1763048/blog/632194

weixin_34419326
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
核心动画之CABasicAnimation
04-02
这是我在学习ios的过程中写的一个demo，使用CABasicAnimation实现对UIView的平移、缩放和旋转
CABasicAnimation的基本使用方法（移动·旋转·放大·缩小）
热门推荐
Evan的专栏
11-07 4万+
博主：最近iOS开发中用到CoreAnimation的framework来做动画效果，虽然以前也用过，但一直没有系统学习过，今天看到一篇非常详细的博文（虽然是日语，但真的写的很好），在此翻译出来供大家学习。 原帖地址：http://www.objectivec-iphone.com/animation/CoreAnimation/CABasicAnimation.html 本文为博主翻译，若需
CABasicAnimation
枫子
10-16 393
概述简介CABasicAnimation是抽象类CAPropertyAnimation的子类，可以直接使用 CABasicAnimation又称基本动画，从fromValue到toValue按照指定的动画属性执行动画注意事项 一个动画对象可以同时添加到多个图层上 对动画的配置必须放在动画添加到图层之前，否则不会呈现指定的动画效果基本动画常用的属性 CABasicAnimation的属性 fr
iOS——CABasicAnimation
LANGJ1的博客
02-27 462
什么是CABasicAnimation CABasicAnimation是核心动画类簇中的一个类，其父类是CAPropertyAnimation，祖父是CAAnimation。 它主要用于制作比较单一的动画，例如：平移、缩放、旋转、颜色渐变、边框的值的变化等，也就是将layer的某个属性值从一个值到另一个值的变化，类似x -> y这种变化。但是对于x -> y -> z甚至更多的变化，它是做不到的。 相关属性 属性 说明 duration 动画的时长 repeatCou
iOS 属性动画的一个分类:CABasicAnimation 基本动画(没有真正修改属性值)
huhuahua6的专栏
09-18 1148
- (IBAction)pressBasicAnimation:(UIButton *)sender { //1.创建并指定修改的属性 //KeyPath :CALayer的属性名,不是所有的属性都可以,只有在头文件中出现animatable的属性才可以; // CABasicAnimation *basic = [CABasicAnimation animationWith
iOS使用 CABasicAnimation 实现简单的跑马灯（无cpu暴涨）
08-31
总结来说，使用CABasicAnimation实现iOS的跑马灯效果，主要步骤包括创建自定义视图、设置视图内容、创建并配置CABasicAnimation以及处理动画结束后的逻辑。合理的设计和优化可以保证动画的平滑运行，同时避免对系统...
Mac CABasicAnimation实现动画旋转
03-11
在Mac开发中，我们通常使用CABasicAnimation来创建各种复杂的动画效果，如旋转、缩放、移动等。 首先，我们需要导入CoreAnimation框架： ```swift import CoreAnimation ``` 然后，创建一个CABasicAnimation实例，...
IOS简单动画总结
08-02
这篇名为“iOS简单动画总结”的博文深入浅出地介绍了如何在iOS应用中实现基础的动画效果。作者通过实例分享了如何利用苹果的UIKit框架进行动画编程。 首先，iOS中的动画主要依赖于Core Animation框架，它提供了丰富...
ios 动画总结
08-05
这可以通过修改`alpha`属性或者使用`CABasicAnimation`来自定义属性动画来实现。比如，我们可以创建一个动画使按钮从不透明渐变至半透明，或者改变背景色。在`animateWithDuration:`方法中，我们可以直接修改`alpha`...
Core Animation一些Demo总结 （动态切换图片、大转盘、图片折叠、进度条等动画效果）
09-02
在这个Demo总结中，我们探讨了几个使用Core Animation实现的典型动画，包括动态切换图片、大转盘、图片折叠以及进度条旋转。 1. 动态切换图片： 动态切换图片的动画效果是通过CABasicAnimation、...
CABasicAnimation用法
ihoudf
05-09 1459
原文地址：http://www.cnblogs.com/bucengyongyou/archive/2012/12/20/2826590.html CABasicAnimation 自己只有三个property fromValue toValue ByValue 当你创建一个 CABasicAnimation 时,你需要通过-setFromValue
iOS CABasicAnimation详解
u013712343的博客
04-12 2035
最近一直在看关于CALayer的相关知识，这里整理一下CABasicAnimation相关知识 1.CAlayer 2.CoreAnimation 3.anchorPoint（锚点） 4.CABasicAnimation 一、关于CAlayer CoreAnimation是基于CAlayer层的动画，CAlayer是定义在QuartzCore框架中的(Core Animation)苹果对于CAlayer的概述CAlayer管理基于图像的内容并允许您对该内容执行动画的对象 层通常用于为视图提供后备存储，但
IOS开发之——CABasicAnimation(95)，程序员必会知识
2401_84148911的博客
04-08 807
分享一份工作1到5年以上的Android程序员架构进阶学习路线体系，希望能对那些还在从事Android开发却还不知道如何去提升自己的，还处于迷茫的朋友！阿里P7级Android架构师技术脑图；查漏补缺，体系化深入学习提升**全套体系化高级架构视频；**七大主流技术模块，视频+源码+笔记有任何问题，欢迎广大网友一起来交流《互联网大厂面试真题解析、进阶开发核心学习笔记、全套讲解视频、实战项目源码讲义》点击传送门即可获取！外链图片转存中…(img-MxTAQKX5-1712543618152)]
iOS动画之CABasicAnimation的使用方法（移动，旋转，缩放）
kuuailetianzi的专栏
12-24 1941
设定动画CABasicAnimation的属性和说明 属性 说明 duration 动画的时间 repeatCount 重复的次数。不停重复设置为 HUGE_VALF repeatDuration 设置动画的时间。 beginTime 指定动画开始的时间。从开始延迟几秒的话，设置为【CACurrentMediaTime() + 秒数】 的方式 timingFunction 设置动画的速度变化 autoreverses 动画结束时是否执行逆.
IOS开发之——CABasicAnimation(95)(1)
最新发布
2401_84132357的博客
04-11 264
其实Android开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。虽然 Android 没有前几年火热了，已经过去了会四大组件就能找到高薪职位的时代了。这只能说明 Android 中级以下的岗位饱和了，现在高级工程师还是比较缺少的，很多高级职位给的薪资真的特别高（钱多也不一定能找到合适的），所以努力让自己成为高级工程师才是最重要的。
核心动画 -- CABasicAnimation简介
zhaoName的博客
08-19 455
Core Animation也就是我们常说的核心动画，它是一组非常强大的用于处理动画的苹果官方API。它直接作用在CALayer层上，在后台执行不会阻塞主线程。
< iOS >CABasicAnimation用法
Jacky Shin的专栏
12-24 1万+
CABasicAnimation 自己只有三个property   fromValue  toValue  ByValue 当你创建一个 CABasicAnimation 时,你需要通过-setFromValue 和-setToValue 来指定一个开始值和结束值。 当你增加基础动画到层中的时候,它开始运行。当用属性做动画完成时,例如用位置属性做动画,层就会立刻 返回到它的初
使用CABasicAnimation实现的动画效果（一）
zm_dlf的博客
03-16 2485
这个动画采用了CABasicAnimation和CAAnimationGroup来实现的，改变位置、改变大小、按钮圆角数合在一起形成一个组合动画。 原来是准备在CABasicAnimation中通过begintime来设置延时的效果，但效果不理想。 代码部分： 自定义按钮 @interface MyButton : UIButton @prop

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值