ios雷达脉冲效果

[objc] view plain copy

1. <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">具体先看效果图</span>  

直接上代码：

[objc] view plain copy

1. @interface CCRadarView : UIView  
2.   
3. /*当前雷达中心缩略图*/  
4. @property (nonatomic,strong)UIImage * thumbnailImage;  
5.   
6. -(instancetype)initWithFrame:(CGRect)frame andThumbnail:(NSString *)thumbnailUrl;  
7.   
8.   
9. @end  

[objc] view plain copy

1. @interface CCRadarView()  
2.   
3. @property (nonatomic,weak)CALayer * animationLayer;  
4.   
5. @end  
6.   
7. @implementation CCRadarView  

[objc] view plain copy

1. </pre><pre name="code" class="objc"><pre name="code" class="objc">-(instancetype)initWithFrame:(CGRect)frame andThumbnail:(NSString *)thumbnailUrl{  
2.     self = [super initWithFrame:frame];  
3.     if (self) {  
4.         [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(resume) name:UIApplicationDidBecomeActiveNotification object:nil];  
5.           
6.         self.backgroundColor = [UIColor clearColor];  
7.         self.thumbnailImage = [UIImage imageNamed:@"friends_default_portrait.png"];  
8.     }  
9.     return self;  
10. }  

[objc] view plain copy

1. - (void)drawRect:(CGRect)rect {  
2.       
3.     [[UIColor clearColor] setFill];  
4.       
5.     UIRectFill(rect);  
6.       
7.     NSInteger pulsingCount = 3;//雷达上波纹的条数  
8.     double animationDuration = 2;//一组动画持续的时间，直接决定了动画运行快慢。  
9.       
10.     CALayer * animationLayer = [[CALayer alloc]init];  
11.     self.animationLayer = animationLayer;  
12.       
13.     for (int i = 0; i < pulsingCount; i++) {  
14.         CALayer * pulsingLayer = [[CALayer alloc]init];  
15.         pulsingLayer.frame = CGRectMake(0, 0, rect.size.width, rect.size.height);  
16.         pulsingLayer.backgroundColor = [UIColor colorWithHexRGB:@"d2e5fb"].CGColor;//圈圈背景颜色，不设置则为透明。  
17.         pulsingLayer.borderColor = [UIColor colorWithHexRGB:@"d2e5fb"].CGColor;  
18.         pulsingLayer.borderWidth = 1.0;  
19.         pulsingLayer.cornerRadius = rect.size.height/2;  
20.           
21.         CAMediaTimingFunction * defaultCurve = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];  
22.           
23.         CAAnimationGroup * animationGroup = [[CAAnimationGroup alloc]init];  
24.         animationGroup.fillMode = kCAFillModeBoth;  
25.         //因为雷达中每个圈圈的大小不一致，故需要他们在一定的相位差的时刻开始运行。  
26.         animationGroup.beginTime = CACurrentMediaTime() + (double)i * animationDuration/(double)pulsingCount;  
27.         animationGroup.duration = animationDuration;//每个圈圈从生成到消失使用时常，也即动画组每轮动画持续时常  
28.         animationGroup.repeatCount = HUGE_VAL;//表示动画组持续时间为无限大，也即动画无限循环。  
29.         animationGroup.timingFunction = defaultCurve;  
30.           
31.         //雷达圆圈初始大小以及最终大小比率。  
32.         CABasicAnimation * scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];  
33.         scaleAnimation.autoreverses = NO;  
34.         scaleAnimation.fromValue = [NSNumber numberWithDouble:0.2];  
35.         scaleAnimation.toValue = [NSNumber numberWithDouble:1.0];  
36.           
37.         //雷达圆圈在n个运行阶段的透明度，n为数组长度。  
38.         CAKeyframeAnimation * opacityAnimation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];  
39.         //雷达运行四个阶段不同的透明度。  
40.         opacityAnimation.values = @[[NSNumber numberWithDouble:1.0],[NSNumber numberWithDouble:0.5],[NSNumber numberWithDouble:0.3],[NSNumber numberWithDouble:0.0]];  
41.         //雷达运行的不同的四个阶段，为0.0表示刚运行，0.5表示运行了一半，1.0表示运行结束。  
42.         opacityAnimation.keyTimes = @[[NSNumber numberWithDouble:0.0],[NSNumber numberWithDouble:0.25],[NSNumber numberWithDouble:0.5],[NSNumber numberWithDouble:1.0]];  
43.         //将两组动画（大小比率变化动画，透明度渐变动画）组合到一个动画组。  
44.         animationGroup.animations = @[scaleAnimation,opacityAnimation];  
45.           
46.         [pulsingLayer addAnimation:animationGroup forKey:@"pulsing"];  
47.         [animationLayer addSublayer:pulsingLayer];  
48.     }  
49.     [self.layer addSublayer:self.animationLayer];  
50.       
51.     //以下部分为雷达中心的用户缩略图。雷达圈圈也是从该图中心发出。  
52.     CALayer * thumbnailLayer = [[CALayer alloc]init];  
53.     thumbnailLayer.backgroundColor = [UIColor whiteColor].CGColor;  
54.     CGRect thumbnailRect = CGRectMake(0, 0, 46, 46);  
55.     thumbnailRect.origin.x = (rect.size.width - thumbnailRect.size.width)/2.0;  
56.     thumbnailRect.origin.y = (rect.size.height - thumbnailRect.size.height)/2.0;  
57.     thumbnailLayer.frame = thumbnailRect;  
58.     thumbnailLayer.cornerRadius = 23.0;  
59.     thumbnailLayer.borderWidth = 1.0;  
60.     thumbnailLayer.masksToBounds = YES;  
61.     thumbnailLayer.borderColor = [UIColor whiteColor].CGColor;  
62.     UIImage * thumbnail = self.thumbnailImage;  
63.     thumbnailLayer.contents = (id)thumbnail.CGImage;  
64.     [self.layer addSublayer:thumbnailLayer];  
65.       
66.       
67. }  

[objc] view plain copy

1. <pre name="code" class="objc">// 动画因应用程序进入后台后会停止。故避免在重新激活程序时出现卡死假象。  
2. - (void)resume{  
3.       
4.     if (self.animationLayer) {  
5.         [self.animationLayer removeFromSuperlayer];  
6.         [self setNeedsDisplay];  
7.     }  
8. }  
9.   
10.   
11. -(void)dealloc{  
12.     [[NSNotificationCenter defaultCenter]removeObserver:self];  
13. }  

[objc] view plain copy

1. </pre><pre name="code" class="objc">其中有个uicolor  (category)  

[objc] view plain copy

1. </pre><pre name="code" class="objc"><pre name="code" class="objc">+ (UIColor *)colorWithHexRGB:(NSString *)rbg  
2. {  
3.     NSString *cString = [[rbg stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]] uppercaseString];  
4.     if (cString.length < 6) {  
5.         return [UIColor clearColor];  
6.     }  
7.       
8.     if ([cString hasPrefix:@"0X"]) {  
9.         cString = [cString substringFromIndex:2];  
10.     }  
11.     if ([cString hasPrefix:@"#"]) {  
12.         cString = [cString substringFromIndex:1];  
13.     }  
14.     if (cString.length != 6) {  
15.         return [UIColor clearColor];  
16.     }  
17.       
18.     NSRange range = NSMakeRange(0, 2);  
19.     NSString *rString = [cString substringWithRange:range];  
20.       
21.     range.location = 2;  
22.     NSString *gString = [cString substringWithRange:range];  
23.       
24.     range.location = 4;  
25.     NSString *bString = [cString substringWithRange:range];  
26.       
27.     unsigned int red = 0;  
28.     unsigned int green= 0;  
29.     unsigned int blue = 0;  
30.     [[NSScanner scannerWithString:rString] scanHexInt:&red];  
31.     [[NSScanner scannerWithString:gString] scanHexInt:&green];  
32.     [[NSScanner scannerWithString:bString] scanHexInt:&blue];  
33.       
34.     return [UIColor colorWithRed:red/255.0 green:green/255.0 blue:blue/255.0 alpha:1.0];  
35. }  

@end