如何让按钮闪烁或闪烁？

Question

我试图在扫描正确时将按钮的颜色（只是闪烁）更改为绿色，在出现问题时将按钮的颜色更改为红色。我可以用这样的视图来做到这一点

func flashBG(){
    UIView.animateWithDuration(0.7, animations: {
        self.view.backgroundColor = UIColor.greenColor()

    })
}

但只要按下按钮，它就会保持绿色

func flashBtn(){
    UIButton.animateWithDuration(0.5, animations: {
        self.buttonScan.backgroundColor = UIColor.greenColor()
    })
}

我已经通过代码创建了按钮

func setupScanButton() {
    let X_Co = (self.view.frame.size.width - 100)/2
    let Y_Co = (self.viewForLayer.frame.size.height + 36/2)

    buttonScan.frame = CGRectMake(X_Co,Y_Co,100,100)
    buttonScan.layer.borderColor = UIColor.whiteColor().CGColor
    buttonScan.layer.borderWidth = 2
    buttonScan.layer.cornerRadius = 50
    buttonScan.setTitle("Scan", forState: .Normal)
    buttonScan.backgroundColor = UIColor.blueColor()
    buttonScan.addTarget(self, action: "buttonScanAction", forControlEvents: .TouchUpInside)
    buttonScan.setTitleColor(UIColor(red:255/255, green: 255/255, blue:255/255, alpha: 1), forState: UIControlState.Normal)

    self.view.addSubview(buttonScan)
}

我应该再次调用 setupScanButton() 吗？

Answer 1

这应该适用于 Swift 4

extension UIView{
     func blink() {
         self.alpha = 0.2
         UIView.animate(withDuration: 1, delay: 0.0, options: [.curveLinear, .repeat, .autoreverse], animations: {self.alpha = 1.0}, completion: nil)
     }
}

Answer 2

这将启动和停止闪烁按钮

onClick

，如果您只想立即闪烁按钮，只需使用第一个语句。

var flashing = false

@IBAction func btnFlash_Clicked(sender: AnyObject) {
        if !flashing{
            self.buttonScan.alpha = 1.0
            UIView.animateWithDuration(0.5, delay: 0.0, options: [.CurveEaseInOut, .Repeat, .Autoreverse, .AllowUserInteraction], animations: {() -> Void in
                self.buttonScan.alpha = 0.0
                }, completion: {(finished: Bool) -> Void in
            })
            
            flashing = true
        }
    else{
        UIView.animateWithDuration(0.1, delay: 0.0, options: [.CurveEaseInOut, .BeginFromCurrentState], animations: {() -> Void in
            self.buttonScan.alpha = 1.0
            }, completion: {(finished: Bool) -> Void in
        })
    }
}

Swift 5.x 版本

带有“扩展”的更新版本。

extension UIView {
    func blink(duration: TimeInterval = 0.5, delay: TimeInterval = 0.0, alpha: CGFloat = 0.0) {
        UIView.animate(withDuration: duration, delay: delay, options: [.curveEaseInOut, .repeat, .autoreverse], animations: {
            self.alpha = alpha
        })
    }
}

调用函数：

button.blink() // without parameters
button.blink(duration: 1, delay: 0.1, alpha: 0.2) // with parameters

要停止动画：归功于链接

func stopBlinking() {
    self.layer.removeAllAnimations()
    alpha = 1
}

Answer 3

我希望这能解决您的问题。

buttonScan.alpha = 1.0
UIView.animate(withDuration: 1.0, delay: 1.0, options: UIView.AnimationOptions.curveEaseOut, animations: {

    buttonScan.alpha = 0.0

}, completion: nil) 

Answer 4

斯威夫特4：

我已经做了一些有用的选项的扩展：

extension UIButton {
    open override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
        return self.bounds.contains(point) ? self : nil
    }
    func blink(enabled: Bool = true, duration: CFTimeInterval = 1.0, stopAfter: CFTimeInterval = 0.0 ) {
        enabled ? (UIView.animate(withDuration: duration, //Time duration you want,
            delay: 0.0,
            options: [.curveEaseInOut, .autoreverse, .repeat],
            animations: { [weak self] in self?.alpha = 0.0 },
            completion: { [weak self] _ in self?.alpha = 1.0 })) : self.layer.removeAllAnimations()
        if !stopAfter.isEqual(to: 0.0) && enabled {
            DispatchQueue.main.asyncAfter(deadline: .now() + stopAfter) { [weak self] in
                self?.layer.removeAllAnimations()
            }
        }
    }
}

首先，当按钮在动画期间具有

hittest

等于 0.0（透明）时，我已将

alpha

函数重写为 启用 touch。

然后，所有输入变量都有一个默认值，因此您可以启动不带参数的

blink()

方法

我还引入了

enabled

参数来启动或停止按钮上的动画。

最后，如果您愿意，您可以使用 stopAfter

 参数在特定时间后停止动画。

用途：

yourButton.blink() // infinite blink effect with the default duration of 1 second

yourButton.blink(enabled:false) // stop the animation

yourButton.blink(duration: 2.0) // slowly the animation to 2 seconds

yourButton.blink(stopAfter:5.0) // the animation stops after 5 seconds.

典型用途：

yourButton.blink(duration: 1.5, stopAfter:10.0)
// your code..
yourButton.blink()
// other code..
yourButton.blink(enabled:false)

Answer 5

你可以尝试这样的事情：

extension UIView {
    func blink() {
        UIView.animateWithDuration(0.5, //Time duration you want,
            delay: 0.0,
            options: [.CurveEaseInOut, .Autoreverse, .Repeat],
            animations: { [weak self] in self?.alpha = 0.0 },
            completion: { [weak self] _ in self?.alpha = 1.0 })
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW,Int64(2 * NSEC_PER_SEC)),dispatch_get_main_queue()){
            [weak self] in
            self?.layer.removeAllAnimations()
        }
    }
}

Answer 6

//MARK : Usage 

yourButton.flash()

extension UIButton {

    func flash() {

        let flash = CABasicAnimation(keyPath: "opacity")
        flash.duration = 0.5
        flash.fromValue = 1
        flash.toValue = 0.1
        flash.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
        flash.autoreverses = true
        flash.repeatCount = 3

        layer.add(flash, forKey: nil)
    }
}

Answer 7

斯威夫特3.0

func btnFlash_Clicked(sender: AnyObject) {

    if !flashing{
        callButton.alpha = 1.0
        UIView.animate(withDuration: 0.5, delay: 0.0, options: [.allowUserInteraction], animations: {() -> Void in
            callButton.alpha = 0.5
        }, completion: {(finished: Bool) -> Void in
        })

        flashing = true
    }
    else{
        flashing = false
        callButton.alpha = 0.5
        UIView.animate(withDuration: 0.5, delay: 0.0, options: [.allowUserInteraction], animations: {() -> Void in
            callButton.alpha = 1.0
        }, completion: {(finished: Bool) -> Void in
        })
    }
}

Answer 8

与

UIViewPropertyAnimator 和 Swift 5

UIViewPropertyAnimator.runningPropertyAnimator(withDuration: 1, delay: 0, options: [.curveLinear,.repeat], animations: {
       UIView.setAnimationRepeatCount(3000)
       self.buttonScan.alpha = 0.0
 }, completion: {_ in   })

Answer 9

斯威夫特3.0

func animateFlash() {        
    flashView.alpha = 0
    flashView.isHidden = false
    UIView.animate(withDuration: 0.3, animations: { flashView.alpha = 1.0 }) { finished in flashView.isHidden = true }
}

Answer 10

这个

UIView

扩展“闪烁”视图并更改背景颜色：

/**
 Blinks a view with a given duration and optional color.

 - Parameter duration: The duration of the blink.
 - Parameter color: The color of the blink.
 */
public func blink(withDuration duration: Double = 0.25, color: UIColor? = nil) {

    alpha = 0.2
    UIView.animate(withDuration: duration, delay: 0.0, options: [.curveEaseInOut], animations: {
        self.alpha = 1.0
    })

    guard let newBackgroundColor = color else { return }
    let oldBackgroundColor = backgroundColor

    UIView.animate(withDuration: duration, delay: 0.0, options: [.curveEaseInOut], animations: {
        self.backgroundColor = newBackgroundColor
        self.backgroundColor = oldBackgroundColor
    })

}

然后您将使用如下：

buttonScan.blink(color: .green)

Answer 11

myButton.alpha = 0.7

UIView.animate(withDuration: 0.3,
                      delay: 1.0,
                    options: [UIView.AnimationOptions.curveLinear, UIView.AnimationOptions.repeat, UIView.AnimationOptions.autoreverse],
                 animations: { myButton.alpha = 1.0 },
                 completion: nil)

Answer 12

另一个流畅的 Swift 5 动画版本：

 public extension UIView {
  func blink(duration: TimeInterval) {
    let initialAlpha: CGFloat = 1
    let finalAlpha: CGFloat = 0.2
    
    alpha = initialAlpha
    
    UIView.animateKeyframes(withDuration: duration, delay: 0, options: .beginFromCurrentState) {
      UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.5) {
        self.alpha = finalAlpha
      }
      
      UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5) {
        self.alpha = initialAlpha
      }
    }
  }
}