使用CALayer中的mask属性绘图和动画

1. CALaye主要是了为了内容展示和动画操作，但CALayer无法响应事件

• mask:图层蒙版，决定了父图层的部分可见区域

  @property(strong) CALayer *mask

  mask图层的范围为父图层的可见区域

• 使用mask属性练习绘制圆后整个圆旋转

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.perAngle = M_PI/60;
        self.centerPoint = CGPointMake(150, 150);
        self.cirleLayer = [CAShapeLayer layer];
        self.cirleLayer.frame = CGRectMake(50, 50, 300, 300);
        self.cirleLayer.fillColor = [UIColor redColor].CGColor;
        self.cirleLayer.strokeColor = [UIColor whiteColor].CGColor;

        self.path = [[UIBezierPath alloc] init];
        [self calculatePoints:self.path];
        self.cirleLayer.path = self.path.CGPath;

        //绘制mask图层，为cirleLayer要显示的区域
        self.mask = [CAShapeLayer layer];
        self.mask.fillColor = nil; //nil代表画圆环，设置了color就是画圆
        self.mask.lineWidth = 10;
        self.mask.strokeColor = [UIColor blackColor].CGColor;
        self.cirleLayer.mask = self.mask;
        [self.layer addSublayer:self.cirleLayer];
        self.timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(updateCurrent) userInfo:nil repeats:YES];
    }
    return self;
}

//画圆的半径
- (void)calculatePoints:(UIBezierPath *)path {

    CGFloat height = 0;
    CGFloat width = 0;
    CGPoint point;
    for (int i= 1; i <= 120; i++) {
        height = 150 * sin(self.perAngle * i);
        width = 150 * cos(self.perAngle * i);
        point = CGPointMake(self.centerPoint.x - width, self.centerPoint.y - height);
        [path moveToPoint:self.centerPoint];
        [path addLineToPoint:point];
    }
}

- (void)updateCurrent
{

    static CGFloat endAngle = 0;
    endAngle += self.perAngle;
    if (endAngle >= M_PI*2) {
        [self.timer invalidate];
        [self startAnimation];
    }else {
        self.maskPath = [UIBezierPath bezierPathWithArcCenter:self.centerPoint radius:150 startAngle:0 endAngle:endAngle clockwise:true];
        self.mask.path = self.maskPath.CGPath;
    }
}

- (void)startAnimation
{
    CABasicAnimation *rotateAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotateAnimation.fromValue = [NSNumber numberWithFloat:0.0];
    rotateAnimation.toValue = [NSNumber numberWithFloat:2 * M_PI];
    rotateAnimation.repeatCount = MAXFLOAT;
    rotateAnimation.duration = 80;
    [self.cirleLayer addAnimation:rotateAnimation forKey:@"rotate"];
}

• 效果展示(gif展示效果有点奇怪，具体效果可在模拟器上看)

circle.gif

---

2. 属性动画结束之后的delegate方法里获取做动画的对象

1.
  groupAnnimation.delegate = self;
  [groupAnnimation setValue:groupLayer forKey:@"animationName"];

2.在animationDidStop获取
    - (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    //获取到调用动画的layer
    CATextLayer *groupLayer = [anim valueForKey:@"animationName"];
    [groupLayer removeFromSuperlayer];
    //另外一个动画的开始
    [self updateCurrentString];
}