iOS CALayer实现按钮的流光效果

前言

hihi，勇敢的小伙伴儿们大家好，今天想给大家分享的是一个动画效果，我在简书上看的，参考文章地址，怎么说呢，我看了代码，实现是很简单的，但是呢，这个代码里硬性条件比较多，比如说需要准备几个图片资源，所以我选择了与之有所差异的方式实现，尽量减少图片的使用，当然，我这个效果是比较简单的，如图：

所以才可以这样做，如果换做参考文章博主的风格，用这种简单的方式的确很难实现，还需要设计师的支持。如图：

虽然我这个很简单，但我还是要分享给有需要的小伙伴儿们~

这里主要是组合动画，一个是后面闪烁一下的轮廓感，一个是前面闪烁一下的流光，话不多说上代码~

正文

首先我们需要研究一下这个按钮或者View的组成。

这里自定义了一个View叫做FlowButton,它由两个子视图组成，一部分是有点击事件的按钮UIButton，一部分是提供流光效果的图片UIImageView，那负责闪烁的轮廓光我们不放在子视图里，原因是轮廓是由layer的shadow的效果形成的轮廓感，如果被包含在FlowButton里面，shadow被裁剪了，就没有阴影效果了。

分析到这里，着手实现。

FlowButton.h

#import <UIKit/UIKit.h>

@interface FlowButton : UIView

@property (nonatomic, strong) UIButton *flowLightBtn; //按钮
@property (nonatomic, strong) UIImageView *flowLightImageView; //流光图

@end

FlowButton.m

#import "FlowButton.h"

@implementation FlowButton

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        //按钮
        self.flowLightBtn = [[UIButton alloc] init];
        //这里设置默认颜色 无需一致
        [self.flowLightBtn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
        [self.flowLightBtn setTitleColor:[UIColor lightTextColor] forState:UIControlStateHighlighted];
        //添加约束必要条件
        self.flowLightBtn.translatesAutoresizingMaskIntoConstraints = NO;
        [self addSubview:self.flowLightBtn];
        
        //流光
        self.flowLightImageView = [[UIImageView alloc] init];
        //设立设置默认颜色 无需一致
        self.flowLightImageView.backgroundColor = [UIColor whiteColor];
        //添加约束必要条件
        self.flowLightImageView.translatesAutoresizingMaskIntoConstraints = N