前言
前端页面开发中,经常用到按钮,按钮的图片是比较小的,但是需要扩大按钮的点击范围.这时,我们一般会想到在响应链上动手
hitTest
/// 返回视图层次结构(包括它自己)中包含指定点的接收方的最远后代。
func hitTest(_ point: CGPoint,
with event: UIEvent?) -> UIView?
- 这个方法通过调用每个子视图的point(inside:with:)方法来遍历视图层次结构，以确定哪个子视图应该接收触摸事件。如果point(inside:with:)返回true，则子视图的层次结构将被类似地遍历，直到找到包含指定点的最前面的视图为止。如果一个视图不包含这个点，它的视图层次结构分支将被忽略。你很少需要自己调用这个方法，但是你可以覆盖它来隐藏子视图中的触摸事件。
- 此方法忽略隐藏的、禁用用户交互或alpha级别小于0.01的视图对象。在确定命中时，此方法不考虑视图的内容。因此，即使指定的点位于视图内容的透明部分，视图仍然可以被返回。
- 位于接收方边界之外的点永远不会被报告为命中，即使它们实际上位于接收方的子视图之一。如果当前视图的clipsToBounds属性设置为false并且受影响的子视图扩展超出了视图的边界，就会发生这种情况。
实现方案
- 扩大的点击区域,我们不用去给按钮添加上下左右单独的属性,直接用
UIEdgeInsets即可,方便直观,不容易设置错误 - 下面是实现代码
open class EnlargeEdgeButton: UIButton {
open var enlargeEdge: UIEdgeInsets = .zero
open override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
if alpha == 0 || isHidden == true || enlargeEdge == .zero {
return super.hitTest(point, with: event)
}
let rect = bounds.enlargeRect(edgeInsets: enlargeEdge)
return rect.contains(point) ? self : nil
}
}
extension CGRect {
public func enlargeRect(edgeInsets: UIEdgeInsets) -> CGRect {
return CGRect(x: minX - edgeInsets.left, y: minY - edgeInsets.top, width: width + (edgeInsets.left + edgeInsets.right), height: height + (edgeInsets.top + edgeInsets.bottom))
}
}
- 这是特别需要注意的是,按钮的几种特殊情况,需要做处理
-
alpha == 0,透明度为0时,相当是按钮是看不见的,那么这时,我们的期望时按钮是隐藏状态的,如果这里加了扩大按钮点击范围的代码,会导致虽然按钮是隐藏的,但是点击按钮的放大区域,还是会响应事件,这会出现一个非常奇怪的bug,而且bug还不好找,本人在工作中就出现过这个失误
2.isHidden == true,同理,隐藏状态时更不应该去扩大点击范围了
3.enlargeEdge == .zero,扩大区域的edge为.zero,相当于是没有加点击范围,那就可以直接调用父类方法,不做额外处理
分类 VS 子类化
- 个人觉得的分类的侵入性比较大,如果给
UIButton添加分类属性enlargeEdge,导致任何继承自UIButton的类都有这个功能.有可能人家压根就不想要这个功能,但是你本来就有这个功能 - 子类化的话,你想要这个功能,你就用这个类,或者继承自这个类,能够做到精准控制
