水波纹效果

• Code

1.-(void)drawRect:(CGRect)rect {2.    [super drawRect:rect];3.    [[UIColor colorWithRed:22 / 255.0 green:163 / 255.0 blue:130 / 255.0 alpha:1] setFill];4.    UIRectFill(rect);5.6.    NSInteger pulsingCount = 6; //  脉冲个数7.    double animationDuration = 3; // 每个脉冲持续时间8.9.    for (int i = 0; i < pulsingCount; i++) {10.        CALayer * pulsingLayer = [CALayer layer];11.        pulsingLayer.frame = CGRectMake(0, 0, rect.size.width, rect.size.height);12.        pulsingLayer.borderColor = [UIColor whiteColor].CGColor;13.        pulsingLayer.borderWidth = 1;14.        pulsingLayer.cornerRadius = rect.size.height / 2;15.16.        CAMediaTimingFunction * easeInCurve = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]; // 控制变化速度17.18.        // 将一个layer的不同的动画效果组合起来19.        CAAnimationGroup * animationGroup = [CAAnimationGroup animation];20.        animationGroup.fillMode = kCAFillModeBackwards;21.        animationGroup.beginTime = CACurrentMediaTime() + (double)i * animationDuration / (double)pulsingCount;22.        animationGroup.duration = animationDuration;23.        animationGroup.repeatCount = HUGE; // HUGE = MAXFLOAT24.        animationGroup.timingFunction = easeInCurve;25.26.        CABasicAnimation * scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];27.        scaleAnimation.fromValue = @0.5;28.        scaleAnimation.toValue = @2.2;29.30.        // 关键帧动画31.        CAKeyframeAnimation * opacityAnimation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];// 控制不透明度32.        opacityAnimation.values = @[@1, @0.9, @0.8, @0.7, @0.6, @0.5, @0.4, @0.3, @0.2, @0.1, @0]; // 不透明度节点33.        opacityAnimation.keyTimes = @[@0, @0.1, @0.2, @0.3, @0.4, @0.5, @0.6, @0.7, @0.8, @0.9, @1];// 指定每个节点路径的时间34.35.        animationGroup.animations = @[scaleAnimation, opacityAnimation];36.        [pulsingLayer addAnimation:animationGroup forKey:@"plulsing"];37.38.        [self.layer addSublayer:pulsingLayer];39.    }40.}41.

• effect picture