這是2015年3月的新加入的iOS動畫,你可能從來沒有聽說過CAReplicatorLayer,那是一個很酷難以理解但強大的CoreAnimation類。
先上效果圖
H5GIF1.gif
20行代碼創建動畫,直接上代碼
/** CAReplicatorLayer可以復制自己子層的layer,并且復制的出來的layer和原來的子layer擁有相同的動效*/
CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];
replicatorLayer.bounds = CGRectMake(0.0,0.0,100.0,100.0);
replicatorLayer.cornerRadius = 10.0;
/** 視圖相對于父視圖的重心位置*/
replicatorLayer.position = self.center;
replicatorLayer.backgroundColor = [UIColor colorWithRed:0.1 green:0.1 blue:0.1 alpha:0.1].CGColor;
[self.layer addSublayer:replicatorLayer];
CALayer *dot = [CALayer layer];
dot.bounds = CGRectMake(0, 0, 10, 10);
dot.position = CGPointMake(50, 20);
dot.backgroundColor = [UIColor colorWithRed:0.1 green:0.1 blue:0.1 alpha:0.6].CGColor;
dot.cornerRadius = 5;
dot.masksToBounds = YES;
[replicatorLayer addSublayer:dot];
CGFloat count = 10.0;
replicatorLayer.instanceCount = count; //小圓圈的個數
CGFloat nrDots = 2 * M_PI/count;
replicatorLayer.instanceTransform = CATransform3DMakeRotation(nrDots, 0, 0, 1); //每次旋轉的角度等于2π/ 10
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
animation.duration = 1; //1秒的延遲動畫。在到原來的點上做縮放變化
animation.fromValue = @(1);
animation.toValue = @(0.1);
animation.repeatCount = MAXFLOAT;
[dot addAnimation:animation forKey:nil];
replicatorLayer.instanceDelay = 1.0/count; //使動畫動起來的秘訣就是給出一點延遲到每一個副本
dot.transform = CATransform3DMakeScale(0.01, 0.01, 0.01); //解決旋轉銜接效果
完整代碼demo下載