iOS之UI--辉光动画

前言：学习来自YouXianMing老师的博客：《辉光UIView的category》以及YouXianMing老师的github源码：《 GlowView 》

　　   而我个人考虑到分类的二次拓展性(或者是再一次拓展)不是特别好，所以将YouXianMing老师的用分类拓展的辉光动画，改写成一个继承CALayer的可拓展的普通类。

　　　一方面，也是作为自我训练编码，对辉光UIView的实现所使用到的上下文绘制、核心动画、GCD中的定时器以及Runtime动态添加属性等知识进一步的熟练运用和提高。

　　   个人经验不足，也许观点片面，读者尽量指出，我不会介意的。嘻嘻。

先展示效果图：

源码下载地址：https://github.com/HeYang123456789/UIView

源码：

 //
 //  GlowLayer.h
 //  GlowView
 //
 //  Created by HEYANG on 16/1/30.
 //  Copyright © 2016年 HeYang. All rights reserved.
 //

 #import <UIKit/UIKit.h>

 //                                     == 动画时间解析 ==
 //
 //  0.0 ----------- 0.0 ------------> glowOpacity [---------------] glowOpacity ------------> 0.0
 //           T                T                           T                           T
 //           |                |                           |                           |
 //           |                |                           |                           |
 //           .                .                           .                           .
 //     hideDuration   animationDuration              glowDuration              animationDuration
 //

 /**
  *  需要考虑的参数
  *
  *  需要考虑的逻辑
  *      1.数值越界问题，通过懒加载
  *      2.动画时间的安排(看前面的动画时间的解析)
  *
  *  需要对外公开的接口
  */

 @interface GlowLayer : CALayer

 #pragma mark - 对外公开的属性

 #pragma mark 设置辉光效果
 /** 辉光的阴影半径 */
 @property (nonatomic,strong)NSNumber *glowRadius;
 /** 辉光的透明度 */
 @property (nonatomic,strong)NSNumber *glowOpacity;

 #pragma mark 设置辉光的时间
 /** 保持辉光的时间，默认设置为0.5f */
 @property (nonatomic,strong)NSNumber *glowDuration;
 /** 不显示辉光的时间，默认设置为0.5f */
 @property (nonatomic,strong)NSNumber *hideDuration;
 /** 辉光的变化时间，从明到暗或者是从暗到明，默认设置为1.f */
 @property (nonatomic,strong)NSNumber *glowAnimationDuration;

 #pragma mark - 对外公开的接口

 /** 在原始的View上创建出辉光layer */
 -(void)createGlowLayerWithOriginView:(UIView*)originView glowColor:(UIColor*)glowColor;

 /** 显示辉光 */
 -(void)showGLowLayer;

 /** 隐藏辉光 */
 -(void)hideGlowLayer;

 /** 开始循环辉光动画 */
 -(void)startGlowAnimation;

 /** 暂停辉光动画 */
 -(void)pauseGlowAnimation;

 /** 重启辉光动画 */
 -(void)reStareGlowAnimation;

 @end

 @interface UIView (GlowViews)

 /** GlowLayer */
 @property (nonatomic,strong)GlowLayer *glowLayer;

 /** 创建GlowLayer，默认辉光颜色为红色 */
 -(void)addGlowLayer;
 /** 创建GlowLayer，需要设置辉光颜色 */
 -(void)addGlowLayerWithGlowColor:(UIColor*)glowColor;

 /** 插入辉光 */
 -(void)insertGlowLayerToSuperlayer;

 /** 完全移除GLowLayer */
 -(void)removeGlowLayerFromSuperlayer;
 @end

 //
 //  GlowLayer.m
 //  GlowView
 //
 //  Created by HEYANG on 16/1/30.
 //  Copyright © 2016年 HeYang. All rights reserved.
 //

 #import "GlowLayer.h"

 @interface GlowLayer ()

 /** 辉光的颜色 */
 @property (nonatomic,strong)UIColor *glowColor;

 /** 需要添加辉光效果的View ，注意这里用的是weak，而不是strong */
 @property (nonatomic,weak)UIView *addedGlowView;

 /** dispatch_source_t */
 @property (nonatomic,strong)dispatch_source_t timer;
 @end

 @implementation GlowLayer

 #pragma mark - 创建辉光

 // 遗留了一个先后顺序的问题，
 /** 在原始的View上创建出辉光layer */
 -(void)createGlowLayerWithOriginView:(UIView*)originView glowColor:(UIColor*)glowColor{
     self.glowColor = glowColor;
     // 创建一个图形上下文 参数：CGSize size：上下文的尺寸 BOOL opaque是否不透明 CGFloat scale缩放因子
     UIGraphicsBeginImageContextWithOptions(originView.bounds.size, NO, [UIScreen mainScreen].scale);
     // 通过get函数得到当前图形上下文,然后将origingView上的图形渲染到这个图形上下文上
     [originView.layer renderInContext:UIGraphicsGetCurrentContext()];
     // 创建贝塞尔曲线
     UIBezierPath *path = [UIBezierPath bezierPathWithRect:originView.bounds];
     // 设置贝塞尔取消绘制的颜色
     [self.glowColor setFill];//这里还是需要懒加载
     // 设置贝塞尔曲线绘制模式
     [path fillWithBlendMode:kCGBlendModeSourceAtop alpha:];

     // 设置self(GlowLayer)初始状态
     self.frame = originView.bounds;
     // 至少要在设置好当前frame值之后，然后添加图形上下文的Image
     // 获得当前图形上下文的图形，然后赋值给CALayer的constraints
     self.contents = (__bridge id _Nullable)(UIGraphicsGetImageFromCurrentImageContext().CGImage);

     // 阴影设置不透明，其他的设置为透明
     self.opacity = .f;
     self.shadowOpacity = .f;
     // 阴影偏移量为(0,0)
     self.shadowOffset = CGSizeMake(, );

     // 关闭图形上下文
     UIGraphicsEndImageContext();

     // 强引用指向这个原来的View
     self.addedGlowView = originView;
 }

 #pragma mark - 显示和隐藏辉光

 /** 显示辉光 */
 -(void)showGLowLayer{
     // 设置阴影初始效果
     self.shadowColor = self.glowColor.CGColor;
     self.shadowRadius = self.glowRadius.floatValue;

     CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:@"opacity"];
     animation.fromValue = @();
     animation.toValue = self.glowOpacity;
     animation.duration = self.glowAnimationDuration.floatValue;
     // 设置最终值
     self.opacity = self.glowOpacity.floatValue;

     [self addAnimation:animation forKey:nil];
 }

 /** 隐藏辉光 */
 -(void)hideGlowLayer{
     self.shadowColor = self.glowColor.CGColor;
     self.shadowRadius = self.glowRadius.floatValue;

     CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:@"opacity"];
     animation.fromValue = self.glowOpacity;
     animation.toValue = @();
     animation.duration = self.glowAnimationDuration.floatValue;
     // 设置最终值
     self.opacity = ;

     [self addAnimation:animation forKey:nil];
 }

 #pragma mark - 循环显示和隐藏辉光

 /** 开始循环辉光动画 */
 -(void)startGlowAnimation{
     CGFloat cycleTime = self.glowAnimationDuration.floatValue *
     + self.glowDuration.floatValue + self.hideDuration.floatValue;
     CGFloat delayTime = self.glowAnimationDuration.floatValue + self.glowDuration.floatValue;

     _timer = dispatch_source_create(DISPATCH_SOURCE_TYPE_TIMER, , , dispatch_get_main_queue());
     dispatch_source_set_timer(_timer, DISPATCH_TIME_NOW, cycleTime * NSEC_PER_SEC, );
     dispatch_source_set_event_handler(_timer, ^{
         [self showGLowLayer];
         dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(delayTime * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
             [self hideGlowLayer];
         });
     });
     dispatch_resume(_timer);
 }
 /** 暂停辉光动画 */
 -(void)pauseGlowAnimation{
     [self removeFromSuperlayer];
 }
 /** 重启辉光动画 */
 -(void)reStareGlowAnimation{
     [self.addedGlowView.layer addSublayer:self];
     [self startGlowAnimation];
 }

 #pragma mark - 懒加载辉光的效果，同时处理数据越界问题
 #pragma mark duration 辉光时间
 -(NSNumber *)glowDuration{
     if (!_glowDuration || _glowDuration.floatValue < ) {
         _glowDuration = @(0.5f);
     }
     return _glowDuration;
 }
 -(NSNumber *)hideDuration{
     if (!_hideDuration || _hideDuration.floatValue < ) {
         _hideDuration = @(0.5);
     }
     return _hideDuration;
 }
 -(NSNumber *)glowAnimationDuration{
     if (!_glowDuration || _glowDuration.floatValue < ) {
         _glowDuration = @(.f);
     }
     return _glowDuration;
 }
 #pragma mark 辉光颜色
 -(UIColor *)glowColor{
     if (!_glowColor) {
         _glowColor = [UIColor redColor];
     }
     return _glowColor;
 }
 #pragma mark 辉光半径
 -(NSNumber *)glowRadius{
     if (!_glowRadius || _glowRadius.floatValue <= ) {
         _glowRadius = @(.f);
     }
     return _glowRadius;
 }
 #pragma mark 辉光透明度
 -(NSNumber *)glowOpacity{
     if (!_glowOpacity || _glowOpacity.floatValue <= ) {
         _glowOpacity = @(0.8);
     }
     return _glowOpacity;
 }
 @end

 #import <objc/runtime.h>

 @implementation UIView (GlowViews)

 /** 创建GlowLayer，默认辉光颜色为红色 */
 -(void)addGlowLayer{
     [self addGlowLayerWithGlowColor:nil];
 }
 /** 创建GlowLayer，需要设置辉光颜色 */
 -(void)addGlowLayerWithGlowColor:(UIColor*)glowColor{
     if (self.glowLayer == nil) {
         self.glowLayer = [[GlowLayer alloc] init];
     }
     [self.glowLayer createGlowLayerWithOriginView:self glowColor:glowColor];
     [self insertGlowLayerToSuperlayer];
 }
 #pragma mark - 插入和移除辉光

 /** 插入辉光 */
 -(void)insertGlowLayerToSuperlayer{
     if (self.glowLayer == nil) {
         self.glowLayer = [[GlowLayer alloc] init];
     }
     [self.layer addSublayer:self.glowLayer];
 }

 /** 移除辉光 */
 -(void)removeGlowLayerFromSuperlayer{
     [self.glowLayer removeFromSuperlayer];
     self.glowLayer = nil;
 }

 #pragma mark - Runtime动态添加属性
 NSString * const _recognizerGlowLayer = @"_recognizerGlowLayer";
 -(void)setGlowLayer:(GlowLayer *)glowLayer{
     objc_setAssociatedObject(self, (__bridge const void *)(_recognizerGlowLayer), glowLayer, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
 }
 -(GlowLayer *)glowLayer{
     return objc_getAssociatedObject(self, (__bridge const void *)(_recognizerGlowLayer));
 }

 @end

使用实例：

转载注明出处：http://www.cnblogs.com/goodboy-heyang/p/5172807.html，尊重劳动成果哦。