当按钮有动画和渐变遮罩时，点击手势不起作用

Question

我想为按钮标题添加渐变，并且按钮应该具有闪烁/闪烁等动画。 通过添加这个，点击手势不起作用

我创建了一个名为“maskingView”的视图，按钮位于使用故事板的名为“btnGradient”的视图中

    let gradient = CAGradientLayer()
    gradient.colors = [UIColor.red.cgColor, UIColor.blue.cgColor]
    gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
    gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
    gradient.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 30)
    maskingView = btnGradient

    // function for animation
    blinkAnimation()

    let tap = UITapGestureRecognizer(target: self, action: #selector(self.goToOtherView(gesture:)))
    tap.delegate = self
    tap.numberOfTapsRequired = 1
    self. maskingView.isUserInteractionEnabled = true
    self. maskingView.addGestureRecognizer(tap)
    maskingView.layer.insertSublayer(gradient, at: 0)


    func blinkAnimation(){
    maskingView.alpha = 1.0
    UIView.animate(withDuration: 0.5, delay: 0.0, options: [.repeat, .autoreverse, .allowUserInteraction], animations: {
        self.maskingView.alpha = 0.0
    }, completion: nil)
    }

Answer 1

这不起作用，因为您正在设置self.maskingView.alpha = 0.0 。 如果您将 alpha 设置为0则系统会将其视为隐藏视图！ 一旦尝试通过设置类似 alpha 的方式，

self.maskingView.alpha = 0.1

示例代码：

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var maskingView: UIView!
    override func viewDidLoad() {
        super.viewDidLoad()

        let gradient = CAGradientLayer()
        gradient.colors = [UIColor.red.cgColor, UIColor.blue.cgColor]
        gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
        gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
        gradient.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 30)

        // function for animation
        blinkAnimation()

        let tap = UITapGestureRecognizer(target: self, action: #selector(self.goToOtherView(gesture:)))
        tap.numberOfTapsRequired = 1
        self.maskingView.isUserInteractionEnabled = true
        self.maskingView.addGestureRecognizer(tap)
        maskingView.layer.insertSublayer(gradient, at: 0)

        // Do any additional setup after loading the view.
    }

    func blinkAnimation(){
        maskingView.alpha = 1.0
        UIView.animate(withDuration: 0.5, delay: 0.0, options: [.repeat, .autoreverse, .allowUserInteraction], animations: {
            self.maskingView.alpha = 0.1
        }, completion: nil)
    }

    @objc func goToOtherView(gesture:Any) {
        print("tap")
    }
}

Answer 2

苹果在它的动画文档中描述：

“在 iOS 中，动画被广泛用于重新定位视图、更改其大小、从视图层次结构中删除它们以及隐藏它们。”

查看编程指南 - Apple

本文继续非常强调使用 Core Animations 而不是 UIView Animations 来获得更详细的动画。

“在你想要执行更复杂的动画，或者 UIView 类不支持的动画的地方，你可以使用 Core Animation 和视图的底层来创建动画。因为视图和图层对象错综复杂地链接在一起，改变视图的层影响视图本身。”

所以基本上说，你操纵视图的层来改变视图。 当为此目的存在核心动画时，我认为直接操作视图是不明智的。 因此，您不能（并且可能不应该）使用 UIAnimations 对 UIView 执行您可以使用核心动画对图层执行的操作。

你必须用CoreAnimation做动画。 因此你的blinkAnimation()方法将是，

func blinkAnimation(){
    let fadein = CABasicAnimation(keyPath: "opacity")
    fadein.fromValue = 1.0
    fadein.toValue = 0.0
    fadein.duration = 0.5
    fadein.autoreverses = true
    fadein.repeatCount = HUGE
    maskingView.layer.add(fadein, forKey: "opacity")
}

这是完整的代码，

    let gradient = CAGradientLayer()
    gradient.colors = [UIColor.red.cgColor, UIColor.blue.cgColor]
    gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
    gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
    gradient.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 30)
    maskingView = btnGradient

    // function for animation
    blinkAnimation()

    let tap = UITapGestureRecognizer(target: self, action: #selector(self.goToOtherView(gesture:)))
    tap.delegate = self as! UIGestureRecognizerDelegate
    tap.numberOfTapsRequired = 1
    self.maskingView.isUserInteractionEnabled = true
    self.maskingView.addGestureRecognizer(tap)
    maskingView.layer.insertSublayer(gradient, at: 0)

点击手势选择器方法是，

@objc func goToOtherView(gesture: UITapGestureRecognizer) {
        print("tap gesture selector called")
    }

Answer 3

遮罩、动画和点击手势/按钮点击（touchUpInside）不能同时工作

所以为了添加渐变使用

btnGradient.setTitleColor(UIColor(patternImage: UIImage(named: "gradientImage")!), for: .normal)

现在添加动画并在按钮上使用 touchUpInside 事件