您的位置:首页 > 移动开发 > IOS开发

关于coreAnimation 核心动画的学习笔记(5)

2015-10-09 17:18 435 查看
3.5 图层的内容 图层的内容提供,是指通过一种方法来制定CALayer 实例的内容: 其中有一下三种方式来提供CAlayer的内容  (1)使用包含图片内容的 CGImageRef 来显式的设置图层的 contents 的属性。   (2)指定一个委托,它提供或者重绘内容。  (3)继承 CALayer 类重载显示的函数。
 
第四章 动画动画是当今用户界面的关键因素。当使用核心动画的时候,动画是自动完成的。 没有动画的循环和计数器。你的应用程序不负负责重绘,也不负责跟踪动画的当前状 态。动画在独立线程里面自动执行,没有和你的应用程序交互。核心动画提供了一套你可以在你应用程序里面使用的动画类的表现:  (1)CABasicAnimation提供了在图层的属性值间简单的插入。 
(2)CAKeyframeAnimation 提供支持关键帧动画。你指定动画的一个图层属性的关键路径,一个表示在动画的每个阶段的价值的数组,还有一个关键帧时间的数组和时间函数。  (3)CATransition提供了一个影响整个图层的内容过渡效果。在动画显示过程中采用淡出(fade)、推出(push)、显露(reveal)图层的内容。 常用的过渡效果可以通过提供你自己定制的核心图像滤镜来扩展。除了要指定显示的动画类型,你还必须指定动画的间隔、它的速度(它的插值如何分布在整个动画过程)、动画循环时候的循环次数、动画周期完成的时候是否自动
的反转、还有动画结束的时候它的可视化状态。动画类和 CAMediaTiming 协议提供 所有这些功能甚至更多的功能。CAAnimation、它的子类、时序协议被核心动画和Cocoa Animation Proxy功能共享。这些类将会在“动画类型和时序编程指南(Animation Types and Timing Programming Guide)”里面详细介绍。
             Core Animation 类的继承关系图 



 
下面将针对上面的知识做一个图片动画的demo



功能1 :移动图片到右下角

//向右下角缩小移动
- (IBAction)buttonClick:(id)sender
{

CGPoint fromPoint = imageView.center;

//路径曲线
UIBezierPath *movePath = [UIBezierPath bezierPath];
[movePath moveToPoint:fromPoint];
CGPoint toPoint = CGPointMake(300, 460);
[movePath addQuadCurveToPoint:toPoint
controlPoint:CGPointMake(toPoint.x,fromPoint.y)];

//关键帧
CAKeyframeAnimation *moveAnim = [CAKeyframeAnimation animationWithKeyPath:@"position"];
moveAnim.path = movePath.CGPath;
moveAnim.removedOnCompletion = YES;

//旋转变化
CABasicAnimation *scaleAnim = [CABasicAnimation animationWithKeyPath:@"transform"];
scaleAnim.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
//x,y轴缩小到0.1,Z 轴不变
scaleAnim.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.1, 0.1, 1.0)];
scaleAnim.removedOnCompletion = YES;

//透明度变化
CABasicAnimation *opacityAnim = [CABasicAnimation animationWithKeyPath:@"alpha"];
opacityAnim.fromValue = [NSNumber numberWithFloat:1.0];
opacityAnim.toValue = [NSNumber numberWithFloat:0.1];
opacityAnim.removedOnCompletion = YES;

//关键帧,旋转,透明度组合起来执行
CAAnimationGroup *animGroup = [CAAnimationGroup animation];
animGroup.animations = [NSArray arrayWithObjects:moveAnim, scaleAnim,opacityAnim, nil];
animGroup.duration = 1;
[imageView.layer addAnimation:animGroup forKey:nil];
}


 功能2 :移动图片到右下角

//向右边旋转
- (IBAction)rightRotateBtnClick:(id)sender
{
CGPoint fromPoint = imageView.center;
UIBezierPath *movePath = [UIBezierPath bezierPath];
[movePath moveToPoint:fromPoint];
CGPoint toPoint = CGPointMake(fromPoint.x +100 , fromPoint.y) ;

[movePath addLineToPoint:toPoint];

CAKeyframeAnimation *moveAnim = [CAKeyframeAnimation animationWithKeyPath:@"position"];
moveAnim.path = movePath.CGPath;

CABasicAnimation *scaleAnim = [CABasicAnimation animationWithKeyPath:@"transform"];
scaleAnim.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];

//沿Z轴旋转
scaleAnim.toValue = [NSValue valueWithCATransform3D: CATransform3DMakeRotation(M_PI,0,0,1)];

//沿Y轴旋转
// scaleAnim.toValue = [NSValue valueWithCATransform3D: CATransform3DMakeRotation(M_PI,0,1.0,0)];

//沿X轴旋转
// scaleAnim.toValue = [NSValue valueWithCATransform3D: CATransform3DMakeRotation(M_PI,1.0,0,0)];
scaleAnim.cumulative = YES;
scaleAnim.duration =1;
//旋转2遍,360度
scaleAnim.repeatCount =2;
imageView.center = toPoint;
scaleAnim.removedOnCompletion = YES;
CAAnimationGroup *animGroup = [CAAnimationGroup animation];
animGroup.animations = [NSArray arrayWithObjects:moveAnim, scaleAnim, nil];
animGroup.duration = 2;

[imageView.layer addAnimation:animGroup forKey:nil];

}


功能3 :图片旋转360度

//图片旋转360度
- (IBAction)rota360BtnClick:(id)sender
{
CABasicAnimation *animation = [ CABasicAnimation
animationWithKeyPath: @"transform" ];
animation.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];

//围绕Z轴旋转,垂直与屏幕
animation.toValue = [ NSValue valueWithCATransform3D:

CATransform3DMakeRotation(M_PI, 0, 0, 1.0) ];
animation.duration = 1;
//旋转效果累计,先转180度,接着再旋转180度,从而实现360旋转
animation.cumulative = YES;
animation.repeatCount = 2;

//在图片边缘添加一个像素的透明区域,去图片锯齿
CGRect imageRrect = CGRectMake(0, 0,imageView.frame.size.width, imageView.frame.size.height);
UIGraphicsBeginImageContext(imageRrect.size);
[imageView.image drawInRect:CGRectMake(1,1,imageView.frame.size.width-2,imageView.frame.size.height-2)];
imageView.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

[imageView.layer addAnimation:animation forKey:nil];
}


参考文档:CoreAnimation官方文档地址http://blog.163.com/donald_wong5/blog/static/190962406201191912456928/Core Animation for Mac OS X and the iPhone   下载地址  http://www.cocoachina.com/bbs/read. href="http://www.th7.cn/program/php/" target=_blank>php?tid=12133&ordertype=asc http://xxxxxfsadf.iteye.com/blog/565785  核心动画编程指南 
 Quartz 2D官方文档
 https://developer.apple.com/library/prerelease/ios/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/Introduction/Introduction.html#//apple_ref/doc/uid/TP30001066
 项目文件下载
 开源Core Animation 示例CA360
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ios开发 动画 opengl