ios 动画基础

转载 2013年12月03日 11:04:39

所有核心动画的动画类都是从 CAAnimation类继承而来


        CAAnimation 实现了 CAMediaTiming协议,提供了动画的持续时间,速度,和重复计数


        CAAnimation 也实现了 CAAction协议。该协议为图层触发一个动画动作提供了提供 标准化响应


        CATransition 提供了一个图层变化的过渡效果,它能影响图层的整个内容。 动画进行的时候淡入淡出(fade)、推(push)、显露(reveal)图层的内容。这些过渡效果可以扩展到你自己定制的Core Image 滤镜


        CAAnimationGroup 允许一系列动画效果组合在一起,并行显示动画


        CAPropertyAnimation是一个抽象的子类,它支持动画的显示图层的关键路径中指定的属性


        CABasicAnimation 简单的为图层的属性提供修改。


        CAKeyframeAnimation支持关键帧动画,你可以指定的图层属性的关键路径动画,包括动画的每个阶段的价值,以及关键帧时间和计时功能的一系列值。在 动画运行是,每个值被特定的插入值替代



        核心动画的 CAConstraint 类 是一个布局管理器,它可以指定子图层类限制于你指定的约束集合。每个约束(CAConstraint类的实例封装)描述层的几何属性(左,右,顶部或底部的边缘或水平或垂直中心)的关系,关系到其同级之一的几何属性层或superlayer


        核心动画的图层和 Cocoa 的视图在很大程度上没有一定的相似性,但是他们两者最大的区别是,图层不会直接渲染到屏幕上


        试图的position坐标和anchorPoint有关


        sublayerTransform属性指定的矩阵只会影响图层的子图层,而不会对 图层本身产生影响


        transform 属性指定的矩阵结合图层的anchorPoint属性作用于图层和图层的子图层上 面


        旋转的单位采用弧度(radians),而不是角度(degress)。以下两个函数,你可以在 弧度和角度之间切换


  1. <span style="font-size:18px;">CGFloat DegreesToRadians(CGFloat degrees) {returndegrees * M_PI / 180;};  
  2.   
  3. CGFloat RadiansToDegrees(CGFloat radians) {returnradians * 180 / M_PI;};</span>  



无法正常运行:

        替换的办法是,你必须通过 setValue:forKeyPath:或者valueForKeyPath:方法,具体如下:


  1. <span style="font-size:18px;">myLayer.transform.rotation.x=0;  
  2.   
  3. [myLayer setValue:[NSNumber numberWithInt:0]forKeyPath:@"transform.rotation.x"];</span>  


        如果一个图层的属性 needsDisplayOnBoundsChange被设置为YES 的时候,当图层的bounds属性改变的时候,图层的内容将会被重新缓存起来。默认情况下图层的needsDisplayOnBoundsChange属性值为NO。


给CALayer提供内容

        1。包含图片内容的 CGImageRef来显式的设置图层的contents 的属性。

        2。指定一个委托,它提供或者重绘内容。

        3。继承 CALayer 类重载显示的函数


创建一个委托类实

        displayLayer:或 drawLayer:inContext:


  1. <span style="font-size:18px;">- (void)displayLayer:(CALayer *)theLayer  
  2.   
  3. {  
  4.   
  5.     // check the value of the layer's state key  
  6.   
  7.     if ([[theLayer valueForKey:@"state"] boolValue])  
  8.   
  9.     {  
  10.   
  11.         // display the yes image  
  12.   
  13.         theLayer.contents=[someHelperObjectloadStateYesImage];  
  14.   
  15.     }  
  16.   
  17.     else {  
  18.   
  19.         // display the no image  
  20.   
  21.         theLayer.contents=[someHelperObjectloadStateNoImage];  
  22.   
  23.     }  
  24.   
  25. }</span>  



        如果你必须重绘图层的内容,而不是通过加载图片,那你需要实现drawLayer:inContext:方法。通过委托可以决定哪些内容是需要的并使用CGContextRef来重绘内容。


        实例重新缓存其内容,可以通过发送以下任何一个方法setNeedsDisplay或setNeedsDisplayInRect:的消息,亦或者设置图层的needsDisplaOnBoundsChange属性为 YES


        CALayer 的属性 contentsGravity允许你在图层的边界内容修改图层的contents图片的位置或者伸缩值。默认情况下,内容的图像完全填充层的边界,忽视自然的图像 宽高比contentsGravity属性值:


        CABasicAnimation提供了在图层的属性值间简单的插入。CAKeyframeAnimation提供支持关键帧动画。你指定动画的一个图层属性的关键路径,一个表示在动画的每个阶段的价值的数组,还有一个关键帧时间的数组和时间函数。 


        CATransition提供了一个影响整个图层的内容过渡效果。在动画显示过程中采用淡出(fade)、推出(push)、显露(reveal)图层的内容。常用的过渡效果可以通过提供你自己定制的核心图像滤镜来扩展


  1. <span style="font-size:18px;">CABasicAnimation *_basicAnimation= [CABasicAnimation animationWithKeyPath:@"opacity"];  
  2.   
  3.    _basicAnimation.duration=3.0;  
  4.   
  5.    _basicAnimation.repeatCount=2;  
  6.   
  7.    _basicAnimation.autoreverses=YES;  
  8.   
  9.    _basicAnimation.fromValue=[NSNumber numberWithFloat:1.0];  
  10.   
  11.    _basicAnimation.toValue=[NSNumber numberWithFloat:0.0];  
  12.   
  13.     [self.m_imageViewBg.layeraddAnimation:_basicAnimation forKey:@"animateOpacity"];</span>  



我们可以通过animationWithKeyPath键值对的方式来改变动画

        animationWithKeyPath的值:

        transform.scale= 比例轉換

        transform.scale.x =闊的比例轉換

        transform.scale.y =高的比例轉換

        transform.rotation.z =平面圖的旋轉

        opacity = 透明度

        margin

        zPosition

        backgroundColor

        cornerRadius

        borderWidth

        bounds

        contents

        contentsRect

        cornerRadius

        frame

        hidden

        mask

        masksToBounds

        opacity

        position

        shadowColor

        shadowOffset

        shadowOpacity

        shadowRadius


  1. <span style="font-size:18px;">  
  2. [self. ui_View.layerremoveAllAnimations];  
  3.   
  4.      
  5.   
  6.    CABasicAnimation *pulse= [CABasicAnimation animationWithKeyPath:@"transform.scale"];  
  7.   
  8.    pulse.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];  
  9.   
  10.    pulse.duration = 0.5 + (rand() % 10) * 0.05;  
  11.   
  12.    pulse.repeatCount = 1;  
  13.   
  14.    pulse.autoreverses = YES;  
  15.   
  16.    pulse.fromValue =[NSNumber numberWithFloat:.8];  
  17.   
  18.    pulse.toValue =[NSNumber numberWithFloat:1.2];  
  19.   
  20.    [self.ui_View.layer addAnimation:pulseforKey:nil];  
  21.   
  22. // bounds  
  23.   
  24.    
  25.   
  26. CABasicAnimation *anim = [CABasicAnimationanimationWithKeyPath:@"bounds"];  
  27.   
  28.    anim.duration = 1.f;  
  29.   
  30.    anim.fromValue =[NSValue valueWithCGRect:CGRectMake(0,0,10,10)];  
  31.   
  32.    anim.toValue =[NSValue valueWithCGRect:CGRectMake(10,10,200,200)];  
  33.   
  34.    anim.byValue  = [NSValuevalueWithCGRect:self. ui_View.bounds];   
  35.   
  36. //    anim.toValue= (id)[UIColor redColor].CGColor;  
  37.   
  38. //   anim.fromValue =  (id)[UIColorblackColor].CGColor;  
  39.   
  40.      
  41.   
  42.    anim.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  43.   
  44.    anim.repeatCount = 1;  
  45.   
  46.    anim.autoreverses = YES;  
  47.   
  48.      
  49.   
  50.    [ui_View.layeraddAnimation:anim forKey:nil];  
  51.   
  52. //cornerRadius  
  53.   
  54.    
  55.   
  56.    CABasicAnimation*anim2 = [CABasicAnimationanimationWithKeyPath:@"cornerRadius"];  
  57.   
  58.    anim2.duration = 1.f;  
  59.   
  60.    anim2.fromValue =[NSNumber numberWithFloat:0.f];  
  61.   
  62.    anim2.toValue =[NSNumber numberWithFloat:20.f];  
  63.   
  64.    anim2.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  65.   
  66.    anim2.repeatCount = CGFLOAT_MAX;  
  67.   
  68.    anim2.autoreverses = YES;  
  69.   
  70.      
  71.   
  72.    [ui_View.layeraddAnimation:anim2 forKey:@"cornerRadius"];  
  73.   
  74. //contents  
  75.   
  76.    
  77.   
  78. CABasicAnimation *anim = [CABasicAnimationanimationWithKeyPath:@"contents"];  
  79.   
  80.    anim.duration = 1.f;  
  81.   
  82.    anim.fromValue =(id)[UIImageimageNamed:@"1.jpg"].CGImage;  
  83.   
  84.    anim.toValue =(id)[UIImageimageNamed:@"2.png"].CGImage;  
  85.   
  86. //   anim.byValue  = (id)[UIImageimageNamed:@"3.png"].CGImage;  
  87.   
  88. //    anim.toValue= (id)[UIColor redColor].CGColor;  
  89.   
  90. //   anim.fromValue =  (id)[UIColorblackColor].CGColor;  
  91.   
  92.      
  93.   
  94.    anim.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  95.   
  96.    anim.repeatCount = CGFLOAT_MAX;  
  97.   
  98.    anim.autoreverses = YES;  
  99.   
  100.      
  101.   
  102.    [ui_View.layeraddAnimation:anim forKey:nil];  
  103.   
  104.    
  105.   
  106. [ui_View.layersetShadowOffset:CGSizeMake(2,2)];  
  107.   
  108.    [ui_View.layersetShadowOpacity:1];  
  109.   
  110.    [ui_View.layersetShadowColor:[UIColorgrayColor].CGColor];  
  111.   
  112. //      
  113.   
  114.    CABasicAnimation *anim =[CABasicAnimation animationWithKeyPath:@"shadowColor"];  
  115.   
  116.    anim.duration = 1.f;  
  117.   
  118.    anim.toValue =(id)[UIColorredColor].CGColor;  
  119.   
  120.    anim.fromValue =  (id)[UIColorblackColor].CGColor;  
  121.   
  122.      
  123.   
  124.    anim.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  125.   
  126.    anim.repeatCount = CGFLOAT_MAX;  
  127.   
  128.    anim.autoreverses = YES;  
  129.   
  130.      
  131.   
  132.    [ui_View.layeraddAnimation:anim forKey:nil];  
  133.   
  134.      
  135.   
  136.    CABasicAnimation *_anim= [CABasicAnimation animationWithKeyPath:@"shadowOffset"];  
  137.   
  138.    _anim.duration = 1.f;  
  139.   
  140.    _anim.fromValue =[NSValue valueWithCGSize:CGSizeMake(0,0)];  
  141.   
  142.    _anim.toValue =[NSValue valueWithCGSize:CGSizeMake(3,3)];  
  143.   
  144.      
  145.   
  146.    _anim.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  147.   
  148.    _anim.repeatCount = CGFLOAT_MAX;  
  149.   
  150.    _anim.autoreverses = YES;  
  151.   
  152.      
  153.   
  154.    [ui_View.layeraddAnimation:_anim forKey:nil];  
  155.   
  156.      
  157.   
  158.      
  159.   
  160.    CABasicAnimation *_anim1= [CABasicAnimation animationWithKeyPath:@"shadowOpacity"];  
  161.   
  162.    _anim1.duration = 1.f;  
  163.   
  164.    _anim1.fromValue =[NSNumber numberWithFloat:0.5];  
  165.   
  166.    _anim1.toValue =[NSNumber numberWithFloat:1];  
  167.   
  168.      
  169.   
  170.    _anim1.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  171.   
  172.    _anim1.repeatCount = CGFLOAT_MAX;  
  173.   
  174.    _anim1.autoreverses = YES;  
  175.   
  176.      
  177.   
  178.    [ui_View.layeraddAnimation:_anim1 forKey:nil];  
  179.   
  180.      
  181.   
  182.      
  183.   
  184.      
  185.   
  186.    CABasicAnimation *_anim2= [CABasicAnimation animationWithKeyPath:@"shadowRadius"];  
  187.   
  188.    _anim2.duration = 1.f;  
  189.   
  190.    _anim2.fromValue =[NSNumber numberWithFloat:10];  
  191.   
  192.    _anim2.toValue =[NSNumber numberWithFloat:5];  
  193.   
  194.      
  195.   
  196.    _anim2.timingFunction =[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];  
  197.   
  198.    _anim2.repeatCount = CGFLOAT_MAX;  
  199.   
  200.    _anim2.autoreverses = YES;  
  201.   
  202.      
  203.   
  204.    [ui_View.layeraddAnimation:_anim2 forKey:nil];</span>  



        CAScrollLayer 对象的滚动区域的范围在它的子图层里面定义。


        CAScrollLaye 不提供键盘或鼠标事件处理,也不提供可见的滚动条。


        CATextLayer可以方便的从字符串或字符串的内容创建一个图层类的内容


        CATiledLayer 允许递增的显示大而复杂的图片


        CAEAGLLayer 提供了一个OpenGLES渲染环境


        CALayer 的还扩展了 NSKeyValueCoding的非正式协议,加入默认键值和额外的结构类型的自动对象包装(CGPoint,CGSize,CGRect,CGAffineTransform和CATransform3D)的支持,并提供许多这些结构的关键路径领域的访问

相关文章推荐

ios基础动画

  • 2017年08月11日 10:44
  • 633KB
  • 下载

iOS动画基础

  • 2015年06月10日 17:12
  • 71KB
  • 下载

[ios开发基础知识之]界面常用基本动画

本文来源:http://www.cnblogs.com/v2m_/archive/2011/10/28/2227979.html 一.基本方式:使用UIView类的UIViewAnimati...

ios 动画基础

所有核心动画的动画类都是从 CAAnimation类继承而来         CAAnimation 实现了 CAMediaTiming协议,提供了动画的持续时间,速度,和重复计数 ...

iOS基础动画

iOS基础动画

**原创**零基础学ios**UI课程03***汤姆猫动画效果实现代码

// // RootViewController.m // 汤姆猫 // // Created by dllo on 15/12/12. // Copyright © 2015年 dllo. ...

IOS 基础动画Core Animation

Core Animation,中文翻译为核心动画,它是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍。也就是说,使用少量的代码就可以实现非常强大的功能。 Core ...

iOS CoreAnimation 基础动画CABasicAnimation

本文参考:http://www.cnblogs.com/kenshincui/p/3972100.html#autoid-3-0-0总结的: Core Animation  *       iOS ...

iOS开发基础知识:Core Animation(核心动画) 详解

http://www.jianshu.com/p/8c1c1697c0ce Core Animation,中文翻译为核心动画,它是一组非常强大的动画处理API,使用它能做出非常炫丽的...
  • jeffasd
  • jeffasd
  • 2016年03月04日 17:28
  • 814

iOS - 动画Animation零基础完全教程之一

当改变一个view的大小时,如果希望慢慢的变大,或者慢慢的变小; 当我们显示一个view时,如果希望慢慢的淡入,而不是一下子就显示出来; 当我们隐藏一个view时,如果希望慢慢的淡出,而不是一下子...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ios 动画基础
举报原因:
原因补充:

(最多只允许输入30个字)