码迷,mamicode.com
首页 > 其他好文 > 详细

Core Animation学习笔记( 转)

时间:2015-01-16 20:47:54      阅读:171      评论:0      收藏:0      [点我收藏+]

标签:

CATransactions

 
CATransaction 事务类,可以对多个layer的属性同时进行修改.它分隐式事务,和显式事务.

区分隐式动画和隐式事务:隐式动画通过隐式事务实现动画 。

区分显式动画和显式事务:显式动画有多种实现方式,显式事务是一种实现显式动画的方式。 

1.隐式事务

除显式事务外,任何对于CALayer属性的修改,都是隐式事务.这样的事务会在run-loop中被提交.

技术分享
- (void)viewDidLoad {
    //初始化一个layer,添加到主视图
    layer=[CALayer layer];
    layer.bounds = CGRectMake(0, 0, 200, 200);
    layer.position = CGPointMake(160, 250);
    layer.backgroundColor = [UIColor redColor].CGColor;
    layer.borderColor = [UIColor blackColor].CGColor;
    layer.opacity = 1.0f;
    [self.view.layer addSublayer:layer];    
    [super viewDidLoad];
}

-(IBAction)changeLayerProperty
{
    //设置变化动画过程是否显示,默认为YES不显示
    [CATransaction setDisableActions:NO];
    //设置圆角
    layer.cornerRadius = (layer.cornerRadius == 0.0f) ? 30.0f : 0.0f;
    //设置透明度
    layer.opacity = (layer.opacity == 1.0f) ? 0.5f : 1.0f;

}  

 

技术分享

111

2. 显式事务

 

通过明确的调用begin,commit来提交动画

技术分享

 修改执行时间

 [CATransaction begin];

 

//显式事务默认开启动画效果,kCFBooleanTrue关闭

[CATransaction setValue:(id)kCFBooleanFalse

forKey:kCATransactionDisableActions];

//动画执行时间

[CATransaction setValue:[NSNumber numberWithFloat:5.0f] forKey:kCATransactionAnimationDuration];

    //[CATransaction setAnimationDuration:[NSNumber numberWithFloat:5.0f]];

anotherLayer.cornerRadius = (anotherLayer.cornerRadius == 0.0f) ? 30.0f : 0.0f;

layer.opacity = (layer.opacity == 1.0f) ? 0.5f : 1.0f;

 

[CATransaction commit];

技术分享

 

 

     事务嵌套
        [CATransaction begin];
     [CATransaction begin];
    [CATransaction setDisableActions:YES];
     layer.cornerRadius = (layer.cornerRadius == 0.0f) ? 30.0f : 0.0f;
    [CATransaction commit];
    //上面的动画并不会立即执行,需要等最外层的commit
    [NSThread sleepForTimeInterval:10];
    //显式事务默认开启动画效果,kCFBooleanTrue关闭
    [CATransaction setValue:(id)kCFBooleanFalse
                     forKey:kCATransactionDisableActions];
    //动画执行时间
    [CATransaction setValue:[NSNumber numberWithFloat:10.0f] forKey:kCATransactionAnimationDuration];
    //[CATransaction setAnimationDuration:[NSNumber numberWithFloat:5.0f]];
    anotherLayer.cornerRadius = (anotherLayer.cornerRadius == 0.0f) ? 30.0f : 0.0f;

    
    [CATransaction commit];

 

CATranstion:提供了影响整个层内容过渡的效果,在动画期间它使层产生fade(渐变),push(推拉)以及reveals(揭示)的动画效果。这些过渡的效果可以通过你自己自定义的core image filters来扩展。

引用:http://hi.baidu.com/vbkan/blog/item/8b3314ca1b1da85ef31fe7d4.html

          http://blog.sina.com.cn/s/blog_74d748180100qi8e.html

 

实现iphone漂亮的动画效果主要有两种方法,一种是UIView层面的,一种是使用CATransition进行更低层次的控制,

第一种是UIView,UIView方式可能在低层也是使用CATransition进行了封装,它只能用于一些简单的、常用的效果展现,这里写一个常用的示例代码,供大家参考。

 

[UIView beginAnimations:@"Curl"context:nil];//动画开始

[UIView setAnimationDuration:0.75];

[UIView setAnimationDelegate:self];

[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:myview cache:YES];

[myview removeFromSuperview];

[UIView commitAnimations];

第二种方式相对复杂一些,但如果更好的进行控制,还是使用这种方法吧,基本使用方法可以看一下如下例子:

 

CATransition *animation = [CATransition animation];

[animation setDuration:1.25f];

[animation setTimingFunction:[CAMediaTimingFunction

functionWithName:kCAMediaTimingFunctionEaseIn]];

[animation setType:kCATransitionReveal];

[animation setSubtype: kCATransitionFromBottom];

[self.view.layer addAnimation:animation forKey:@"Reveal"];

这里使用了setType与setSubtype组合,这使用个比较保险,因为他的参数就是官方API里定义的,他们的参数说明可以参考如下(默认类型是淡入淡出类型。):

 

setType:可以返回四种类型:

kCATransitionFade       淡出

kCATransitionMoveIn  覆盖原图

kCATransitionPush       推出

kCATransitionReveal底部显出来

 

setSubtype:也可以有四种类型:

 

kCATransitionFromRight;

kCATransitionFromLeft(默认值)

kCATransitionFromTop;

kCATransitionFromBottom

还有一种设置动画类型的方法,不用setSubtype,只用setType

 

[animation setType:@"suckEffect"];

这里的suckEffect就是效果名称,可以用的效果主要有:

 

pageCurl               向上翻一页

pageUnCurl             向下翻一页

rippleEffect             滴水效果

suckEffect 收缩效果,如一块布被抽走

cube                   立方体效果

oglFlip              上下翻转效果

最后再给出一种常用代码供大家参考。

 

 

示例代码一:

 

// Curl the image up or down

CATransition *animation = [CATransition animation];

[animation setDuration:0.35];

[animation setTimingFunction:UIViewAnimationCurveEaseInOut];

if (!curled){

//animation.type = @"mapCurl";

animation.type = @"pageCurl";

animation.fillMode = kCAFillModeForwards;

animation.endProgress = 0.99;

} else {

//animation.type = @"mapUnCurl";

animation.type = @"pageUnCurl";

animation.fillMode = kCAFillModeBackwards;

animation.startProgress = 0.01;

}

[animation setRemovedOnCompletion:NO];

[view exchangeSubviewAtIndex:0 withSubviewAtIndex:1];

[view addAnimation:animation forKey"pageCurlAnimation"];

// Disable user interaction where necessary

if (!curled) {

 

} else {

 

}

urled = !curled;

 

示例代码二:

 

头部导入: #import <QuartzCore/QuartzCore.h>

 

 

- (void) startAction:(id) sender{

// 定义动画

CATransition *animation = [CATransition animation];

animation.delegate = self;

animation.duration =1.0f;

animation.timingFunction = UIViewAnimationCurveEaseInOut; 

//可根据需要,设置type和subtype属性产生不同的动画效果

 

//animation.type = kCATransitionPush;

//animation.type = kCATransitionMoveIn;

//animation.type = kCATransitionReveal;

//animation.type = kCATransitionFade;

 

//animation.subtype = kCATransitionPush;

//animation.subtype = kCATransitionMoveIn;

//animation.subtype = kCATransitionReveal;

//animation.subtype = kCATransitionFade;

 

switch ([(UISegmentedControl *)self.navigationItem.titleView selectedSegmentIndex]) {

case 0:

animation.type = @"rippleEffect";

//animation.type = @"cube";  //立方体翻转

//animation.type = @"oglFlip";  //层翻转

//animation.type = @"cameraIrisHollowClose";

//animation.type = @"cameraIrisHollowOpen";

break;

case 1:

animation.type = @"pageCurl";

break;

case 2:

animation.type = @"pageUnCurl";

break;

case 3:

animation.type = @"suckEffect";

break;

default:

break;

}

 

 

switch (direction) {    //方向

case 0:

animation.subtype = kCATransitionFromRight;

break;

case 1:

animation.subtype = kCATransitionFromTop;

break;

case 2:

animation.subtype = kCATransitionFromLeft;

break;

case 3:

animation.subtype = kCATransitionFromBottom;

break;

default:

break;

}

 

//执行动画

UIView *bgView = [self.view viewWithTag:150];

NSInteger front = [[bgView subviews] indexOfObject:[bgView viewWithTag:151]];

NSInteger back = [[bgView subviews] indexOfObject:[bgView viewWithTag:152]];

if (someThing) {

[bgView exchangeSubviewAtIndex:front withSubviewAtIndex:back];  //图形变换

}else {

[bgView exchangeSubviewAtIndex:back withSubviewAtIndex:front];

}

 

[[bgView layer] addAnimation:animation forKey:@"animation"];     //bgView层执行动画

//[[self.view layer] addAnimation:animation forKey:@"animation"];  //self.view层执行动画

 

}

CABasicAnimation

CABasicAnimation:为层的属性提供了简单的插值

技术分享
    //需要改变的属性
    CABasicAnimation *animation=[CABasicAnimation animationWithKeyPath:@"cornerRadius"];
    animation.fromValue=[NSNumber numberWithFloat:0.0f];
    animation.toValue=[NSNumber numberWithFloat:40.0f];
    //执行时间
    animation.duration = 10.0;
    //执行次数
    animation.repeatCount=2;

    [layer addAnimation:animation forKey:@"change"]; 

技术分享

 

 

     

技术分享
    CABasicAnimation* rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];

//角度转弧度

rotationAnimation.toValue = [NSNumber numberWithFloat:(DEGREES_TO_RADIANS(160))];

rotationAnimation.duration = 1.0f;

//回退动画

rotationAnimation.autoreverses = YES; 

//动画开始结束的快慢,设置为加速

rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

[pinLayer addAnimation:rotationAnimation forKey:@"revItUpAnimation"];

技术分享

技术分享

 

iphone中CABasicAnimation和UIView动画的区别[转]

关于UIView动画:

  1. [UIView beginAnimations:@"zoom out" context:nil];
  2. [UIView setAnimationDuration:1.f];
  3. [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
  4. cover.transform = CGAffineTransformMakeScale(9.25,7.05);
  5. cover.center = CGPointMake(430, 512);
  6. [UIView commitAnimations]

UIView动画是应用在一个view上面的。

关于CABasicAnimation动画:

  1. - (CAAnimation *)animationMove:(CGPoint)rootCenter
  2. {
  3.     CABasicAnimation *animationMove
  4.     = [CABasicAnimation animationWithKeyPath:@"position"];
  5.     animationMove.duration = 1;
  6.     animationMove.autoreverses = NO;
  7. //    animationMove.delegate = self;
  8.     animationMove.removedOnCompletion = NO;
  9.     animationMove.fillMode = kCAFillModeForwards;
  10.     animationMove.fromValue = [NSValue valueWithCGPoint:self.oldCoverCenter];
  11.     animationMove.toValue =[NSValue valueWithCGPoint:rootCenter];
  12.  
  13.     return animationMove;
  14. }

CABasicAnimation动画是应用在一个layer上面的。

注:
1,把一个image放在一个view的layer上来放大的时候,如果用UIView来做,图片不会太多的失真和闪烁的效果,但是用CABasicAnimation来做失真和闪烁现象会很严重,效果很不好。
2,做 动画的叠加效果 很简单,只要把各自的动画放在一起就可以了。请看这个效果:一本书边移动到屏幕中间,边放大,边打开封面的效果。

  1. [imageLayer addAnimation:[self animationOpen] forKey:@"Open"];
  2. [UIView beginAnimations:@"zoom out" context:nil];
  3. [UIView setAnimationDuration:1.f];
  4. [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
  5. cover.transform = CGAffineTransformMakeScale(5.5,5.5);
  6. cover.center = CGPointMake(629, 384);
  7. [UIView commitAnimations];
  8.  
  9. - (CAAnimation *)animationOpen
  10. {
  11.     CABasicAnimation *animationOpen
  12.     = [CABasicAnimation animationWithKeyPath:@"transform.rotation.y"];
  13.     animationOpen.duration = 1;
  14.     animationOpen.autoreverses = NO;
  15.     animationOpen.delegate = self;  //然后执行真正地打开书的内容
  16.     animationOpen.removedOnCompletion = NO;
  17.     animationOpen.fillMode = kCAFillModeForwards;
  18.     animationOpen.fromValue = [NSNumber numberWithFloat:-M_PI/5];
  19.     animationOpen.toValue = [NSNumber numberWithFloat:-M_PI/1.5];
  20.  
  21.     return animationOpen;
  22. }

     

 

CAPropertyAnimation

CAPropertyAnimation:它是CAAnimation的一个抽象子类,支持层在动画期间为层提供key path。

 

Core Animation学习笔记( 转)

标签:

原文地址:http://www.cnblogs.com/wj033/p/4229480.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!