ios动画学习(二)

来源:互联网 发布:crt如何ping端口 编辑:程序博客网 时间:2024/05/21 16:38

使用CALayer制作动画

一篇比较高水平的介绍CALayer的博客:点我

CALayer与一般的UIView同属层级的架构,在每个CALayer对象中,都可存放该动画图层的属性与它的子层级中每一个动画图层的引用。
CALayer的相关属性标示:

下面通过修改CALayer的position属性来说明CALayer的使用方法:
<pre name="code" class="objc">- (void)viewDidLoad {    [super viewDidLoad];            //#import "QuartzCore/QuartzCore.h"    UIImage *image = [UIImage imageNamed:@"bg.png"];    layer = [CALayer layer];    layer.bounds = CGRectMake(0, 0, 326, 444);    layer.contents = (id)[image CGImage];    layer.position = CGPointMake(183, 242);    [self.view.layer addSublayer:layer];}- (IBAction)leftPress:(id)sender {    [CATransaction setAnimationDuration:5];//修改动画默认时长(为1/4秒)属性    layer.position = CGPointMake(10, 242);}- (IBAction)rightPress:(id)sender {    [CATransaction setAnimationDuration:5];    layer.position = CGPointMake(330, 242);}

动画效果:



下面看看CALayer的另一个子类CATextLayer的相关内容:
CATextLayer是专门的文字图层,通过string属性设置文字内容,fontSize设置位子大小,foregroundColor设置文字颜色。
其中fontSize和foregroundColor属性是可以通过动画形式变化的。文字图层也可以加到其他图层上成为子图层,这样文字
图层就会随着父图层而变化。


-(void)initTextLayer{    textLayer = [CATextLayer layer];    textLayer.bounds = CGRectMake(0, 0, 150, 50);    //文字内容    textLayer.string = @"文字图层";    //字体颜色,字体大小默认为36    textLayer.foregroundColor = [[UIColor redColor]CGColor];    textLayer.position = CGPointMake(150, 100);    [layer addSublayer:textLayer];}- (IBAction)leftPress:(id)sender {    [CATransaction setAnimationDuration:5];//修改动画默认时长(为1/4秒)属性    layer.position = CGPointMake(10, 242);    textLayer.fontSize = 24;    textLayer.foregroundColor = [[UIColor yellowColor]CGColor];}- (IBAction)rightPress:(id)sender {    [CATransaction setAnimationDuration:5];    layer.position = CGPointMake(330, 242);    textLayer.fontSize = 36;    textLayer.foregroundColor = [[UIColor redColor]CGColor];}

layer是图片图层。
效果如下:




下面是本节最后一个图层CAReplicatiorLayer,它也是CALayer子类。
replicator翻译过来是复制基因,重复符的意思。
可以把CAReplicatiorLayer看作是一个管理子图层及子图层副本的一种图层,子图层的副本不是CAReplicatiorLayer的子图层(可以通过打印sublayers.count得知)
可以指定子图层副本的不同位置、颜色等等。
//定义角度转弧度宏#define DEGREES_TO_RADIANS(degrees) ((M_PI * degrees)/180)//初始化复制图层-(void)initReplicatorLayer{    replicatorLayer = [CAReplicatorLayer layer];    //副本数    replicatorLayer.instanceCount = 5;//创建4个副本        CATransform3D finalTransform = CATransform3DMakeTranslation(50, 50, 0);//副本依次位移    [replicatorLayer setInstanceTransform:finalTransform];    [replicatorLayer addSublayer:[self createShapeLayer]];//把形状图层加为子图层    [self.view.layer addSublayer:replicatorLayer];    NSLog(@"图层数=%ld",replicatorLayer.sublayers.count);}//分离- (IBAction)doSplit:(id)sender {    [CATransaction setAnimationDuration:3];    CATransform3D finalTransform = CATransform3DMakeTranslation(50, 50, 0.1);    [replicatorLayer setInstanceTransform:finalTransform];    replicatorLayer.instanceAlphaOffset = -0.25;//副本透明度从1依次减0.25}//合并- (IBAction)doMerge:(id)sender {    [CATransaction setAnimationDuration:3];    CATransform3D finalTransform = CATransform3DMakeTranslation(0, 0, 0.1);    [replicatorLayer setInstanceTransform:finalTransform];}//创建形状图层-(CAShapeLayer *)createShapeLayer{    CAShapeLayer * shapeLayer = [CAShapeLayer layer];    shapeLayer.bounds = CGRectMake(0, 0, 100, 100);    shapeLayer.position = CGPointMake(50, 50);    UIBezierPath * path = [UIBezierPath bezierPath];    [path moveToPoint:CGPointMake(70, 70)];    [path addArcWithCenter:CGPointMake(70, 70) radius:50 startAngle:DEGREES_TO_RADIANS(0) endAngle:DEGREES_TO_RADIANS(270) clockwise:NO];//添加弧形    //[path moveToPoint:CGPointMake(70, 120)];    [path addArcWithCenter:CGPointMake(70, 70) radius:50 startAngle:DEGREES_TO_RADIANS(90) endAngle:DEGREES_TO_RADIANS(180) clockwise:YES];//    [path closePath];    shapeLayer.path = path.CGPath;    return shapeLayer;}

效果如下:


0 0
原创粉丝点击