最近看到了一个网易新闻上不是很复杂的小效果，就是网易启动页右上角的跳过按钮，我们一起来感受一下。

对的，你没看错就是箭头所指右上角的那个小按钮，现在我们来尝试实现一下。由于该控件可以响应事件，所以我们让该该控件继承自UIButton来进行重写。

定义继承自UIButton的类SkipButton，然后使用CAShapeLayer来实现边缘的的动画。

1)首先我们来定义一个回调方法

自定义一个初始化的方法；

为了可以让点击事件也通过回调方法将事件传递出来做统一处理，我们提供属性来提供设置接口，该属性为YES时，点击事件会触发回调接口，默认不触发

提供一个开始动画的方法，

2)方法实现

2.1在初始化方法中，

参数说明：blockKey 定义了一个静态字符变量，使用其地址作为存储回调方法block的key值，使用

objc_setAssociatedObject(self, &blockKey, finished, OBJC_ASSOCIATION_COPY)存储回调方法，便于在其他方法中使用;

circleColor：存储初始化方法中传入的外层圆环的颜色；

lineWidth：存储初始化方法中传入的外层圆环线宽度；

timeCount：存储初始化方法中传入的动画持续时间；

shapeLayer：显示外层圆环的图形层；

progressAni：实现外层圆环的CABaseAnimation对象。

2.2 使用懒加载创建shapeLayer和progressAni

在创建shapeLayer的过程中，我们将弧度区间在（－M_PI_2， － （M_PI ＊ 2＋ M_PI_2））的整个圆环逆时针路径赋值给_shapeLayer的path属性；

在创建progressAni的过程中，对于duration属性的赋值，如果没有给定初始化值，默认为2.0秒；

同时指定动画的代理，这样当动画结束的时候我们就可以通过下边的代理方法获取回调时机：

那么重点来了，一切准备结束，我们来实现startAnimation方法：

如果sameActionWithClick属性为YES，则设置点击事件，同时在点击事件里调用回调方法，同时移除shapeLayer上的动画以及ShapeLayer这个图形层，避免点击事件之后外层圆环继续显示。

想要了解详细实现，请下载SkipButtonDemo。