Swift - 如何使 UIButton 仅在附加的图像上点击交互并忽略透明部分

Posted 2023-03-21

【中文标题】Swift - 如何使 UIButton 仅在附加的图像上点击交互并忽略透明部分

【英文标题】：Swift - How to make UIButton tap Interaction only on the image attached and ignore transparent parts

【发布时间】：2019-08-27 04:01:00

【问题描述】：

我正在创建具有不同图像形状的按钮...一切正常，但如果创建了菱形形状，您可以单击按钮的透明部分。我设法设置阴影以尊重按钮的形状，使其看起来突出显示，但如何应用它以便在交互时忽略按钮的透明部分？

我找到了一些答案，但我不使用路径来创建 UIButton 形状，而是使用 UIButton 上的图像。

下面是如何创建我的一个按钮并设置发光

extension UIbutton 
  func createSquareButton(buttonPositionX: CGFloat, buttonPositionY: CGFloat, buttonWidth: CGFloat, buttonHeight: CGFloat, buttonTitle: String) 
    let button = self
    button.isUserInteractionEnabled = true
    button.frame = CGRect(x: buttonPositionX, y: buttonPositionY, width: buttonWidth, height: buttonHeight)
    button.setTitle(buttonTitle, for: .normal)
    button.setTitleColor(UIColor.white, for: .normal)
    button.setTitleColor(UIColor.black, for: .highlighted)
    button.alpha = 1.0
    button.titleLabel?.font = .systemFont(ofSize: 20)
    button.backgroundColor = nil
    button.tintColor = Style.PurpleColor

    let image = UIImage(named: "Plain Square")
    let imageView = UIImageView(image: image)
    imageView.setImageColor(color: Style.PurpleColor)
    button.setBackgroundImage(imageView.image, for: .normal)
    button.setBackgroundImage(imageView.image, for: .selected)
    button.setBackgroundImage(imageView.image, for: .highlighted)
   


 func buttonGlow(sender: CustomBtn)

    for button in buttonArray 
        if button.UUIDtag == currentSelectedMarkerUUID 

            sender.layer.shadowColor = button.tintColor.cgColor
            sender.layer.shadowRadius = 15
            sender.layer.shadowOpacity = 1.0
            sender.layer.masksToBounds = false

         else 
            let otherBtn = tmpButtonPicked(uuid: button.UUIDtag!)
            otherBtn.layer.shadowColor = UIColor.clear.cgColor
            otherBtn.layer.shadowRadius = 0
        
    


extension UIImageView 
func setImageColor(color: UIColor) 
    let templateImage = self.image?.withRenderingMode(UIImage.RenderingMode.alwaysTemplate)
    self.image = templateImage
    self.tintColor = color
  

【问题讨论】：

使用图像没有简单的方法。你最好使用路径。如果您一心想这样做，那么我建议您手动查找按钮内的接触点 (***.com/a/43042911/7842542)，然后决定是否采取行动

【参考方案1】：

感谢 Malik 的帮助，我解决了这个问题。

首先，您需要实现下面的函数，该函数可以识别您在按钮内点击的 alpha 值是多少。

 func alphaFromPoint(sender: CustomBtn, point: CGPoint) -> CGFloat 
    var pixel: [UInt8] = [0, 0, 0, 0]
    let colourSpace = CGColorSpaceCreateDeviceRGB()
    let alphaInfo = CGBitmapInfo(rawValue: CGImageAlphaInfo.premultipliedLast.rawValue)
    let context = CGContext(data: &pixel, width: 1, height: 1, bitsPerComponent: 8, bytesPerRow: 4, space: colourSpace, bitmapInfo: alphaInfo.rawValue)

    context?.translateBy(x: -point.x, y: -point.y)

    sender.layer.render(in: context!)

    let floatAlpha = CGFloat(pixel[3])
    return floatAlpha

然后我调整了@IBaction 以接收事件类型。然后我将 Malik 提到的代码添加到@IBaction

 @IBAction func mainButton(sender: CustomBtn, forEvent event: UIEvent)

    let touches = event.touches(for: sender)
    let touch = touches?.first
    guard let touchPoint = touch?.location(in: sender) else return
    let alphaValue = alphaFromPoint(sender: sender, point: touchPoint)

    if alphaValue > 0 
      //Do Something if the alpha value is bigger than 0 
   

如果从 alphaValue 变量返回的值是 0，那么你就知道它是透明的。

【参考方案2】：

Swift 5 版本alphaFromPoint 函数。

func alphaFromPoint(point: CGPoint) -> CGFloat

    var pixel: [UInt8] = [0, 0, 0, 0]
    let colorSpace     = CGColorSpaceCreateDeviceRGB();
    let alphaInfo      = CGBitmapInfo(rawValue: CGImageAlphaInfo.premultipliedLast.rawValue)
    let context        = CGContext(data: &pixel, width: 1, height: 1, bitsPerComponent: 8, bytesPerRow: 4, space: colorSpace, bitmapInfo: alphaInfo.rawValue)
    
    context!.translateBy(x: -point.x, y: -point.y);
    self.layer.render(in: context!)
    let floatAlpha = CGFloat(pixel[3])
    return floatAlpha