ios做个菱形的Button？

    面试官：“如何制作一个菱形的Button，比如现在button的背景图是个菱形，如何实现点击图片中的菱形内有响应而点击菱形外没有响应？“ 

    今天上班时脑子里突然闪过了这个场景和这个问题，上述是一个真实的场景，当然结果是悲惨的....   我一方面责怪自己没有在面试后就马上去总结下这个问题，另一方面开始考虑这个问题应该如何实现。虽然说亡羊补牢已经晚了，就当是给自己的一个教训吧。废话说了这么多，那到底如何才能实现上述需求呢？

    首先我想试用button的layer层去绘制整个button，结果当然是否定的，layer层负责button的绘制和显示，但是它并没有响应交互(触摸)事件的接口，所以无论这个button长啥样儿，负责响应的部分还是原来的样子。看样子只能另行他法了，其实到目前为止我们的思路都是处于视觉上去解决这个事情。实际上应该从iOS响应触碰事件的角度去考虑，因此不得不扯出一个关键词：响应链。

    在iOS中，交互事件分为三类——触控事件、传感器事件、远程控制事件。既然是按键的点击响应，那这里我们只谈谈触控事件。当用户与App发生触摸交互行为时，系统不断发送给我们App的那些事件对象，然后按照特定的路径传递给我们App中的一些对象来处理。iOS中我们用UITouch表示触摸对象，UIEvent表示触摸事件，UIEvent中包含与用户触摸操作相关的所有UITouch对象(allTouches)。UIKit使用UIResponder作为响应对象，来响应系统传递过来的事件并进行处理。UIApplication、UIViewController、UIView、和所有从UIView派生出来的UIKit类（包括UIWindow）都直接或间接地继承自UIResponder类。而它则为我们提供了四种方法来响应触控事件。

1- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

2- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event

3- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event

4- (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event

    其中UITouch类提供了触控操作的时间、location以及tapCount等属性(readonly)。这就表明我们可以通过覆写上述四种方法来实现对任意一种视图的自定义触控。

响应链是什么？从字面意义描述，响应链是一系列相连的响应者对象。而从系统角度出发，响应链是一个可以响应用户交互行为的过程。针对触控事件，当一个用户点击了App视图上的某一个视图时，系统中经历了以下两个关键过程：

    1、返回触摸事件发生的Hit-test视图

首先，触摸事件由UIApplication对象传递给App的关键窗口对象(key window)，而窗口对象则尝试把事件传递给触摸发生的视图，这个视图被称作hit-test视图，而寻找hit-test视图的过程被称作hit-testing。Hit-testing包括检查触摸事件是否发生在任何相关视图对象的范围内， 如果是，则递归地检查所有视图的子视图。在视图层次中的最底层视图，如果它包含了触摸点，那么它就是hit-test视图。等 iOS决定了hit-test视图之后，它把触摸事件传递给该视图以便处理。hitTest:withEvent: 方法为给定的CGPoint 和 UIEvent返回hit-test 视图。hitTest:withEvent:方法首先会调用pointInside:withEvent: 方法。如果触摸点在视图范围内，则pointInside:withEvent:返回YES。然后，方法递归地给每个子视图调用hitTest:withEvent:方法并。如果传递到hitTest:withEvent:方法的点不再视图的范围内，pointInside:withEvent:方法返回NO,则该触摸点被忽视，并且hitTest:withEvent:返回nil. 如果一个子视图返回NO，则视图层次的整个分支都被忽视。如果hit-test视图被找到，则又它处理触摸事件。

    2、由Hit-test视图开始的触摸事件传递

    很多类型的事件都在事件传递中依赖响应链。 响应链是一系列相连的响应者对象。 它由第一个响应者开始，以应用对象结束。 如果第一响应者不能处理该事件，它把事件传递给响应链中的下一个响应者。在触摸事件中，如果hit-test视图无法处理一个触摸事件，则该事件以hit-test视图开始的响应链中往上传递。

扯了那么多题外话，那到底如何实现一个菱形的button呢？其实关键点就在寻找hit-test视图中，我们可以自定义button的子类，并在创建按键时实例化其子类，当我们点击button时，系统会进入寻找触摸事件发生的Hit-test视图的过程，此时我们通过覆写pointInside:withEvent:方法(入参会传入触控点CGPoint)，如果触点落在了菱形外，我们就返回NO，则该点就会被忽视，无法响应点击事件。如果落在了菱形内，返回YES，表明被找到，则可以响应点击事件。那么如何区分菱形的内外呢？ 其实这是一个仁者见仁的事情，OBShapedButton为我们提供了一种思路：

如果button的背景图是个菱形，由于图片是矩形，那么菱形外的alpha值必定为0，因此，我们可以通过计算得出图片中当前触摸点(CGPoint)的alpha值，再与我们的预设门限值作比较，如果触摸点在菱形内则alpha大于预设值，返回YES，反之则返回NO。上面的代码判断alpha值，下面的代码为覆写pointInside:withEvent方法，利用alpha的判断结果确定触摸点在菱形外还是菱形内。这样就达到了当点击菱形外时，因为pointInside:withEvent返回NO，从而系统放弃了对hit-test视图的寻找，从而不会进行响应的效果了。

       其实掌握了方法，无所谓菱形圆形三角形，判断方法都是一样的，而根据point的alpha值也只是其中一种思路，毕竟内部原理了解过后，实现方式就有很多种嘛。