Question

我试图在点击时为UIButton做缩放动画，但我想要完成的是点击按钮时我需要UIButton更小到内部然后它来了回到相同的大小（像泡沫）。

我尝试了以下内容：

button.transform = CGAffineTransformMakeScale(-1, 1)

UIView.animateWithDuration(0.5, animations: { () -> Void in

    button.transform = CGAffineTransformMakeScale(1,1)

})

Answer 1

试试这个

UIView.animate(withDuration: 0.6,
    animations: {
        self.button.transform = CGAffineTransform(scaleX: 0.6, y: 0.6)
    },
    completion: { _ in
        UIView.animate(withDuration: 0.6) {
            self.button.transform = CGAffineTransform.identity
        }
    })

Answer 2

SWIFT 4代码更新：我的动画按钮具有漂亮的弹跳效果，带有弹簧动画。

@IBOutlet weak var button: UIButton!

@IBAction func animateButton(sender: UIButton) {

    sender.transform = CGAffineTransform(scaleX: 0.6, y: 0.6)

    UIView.animate(withDuration: 2.0,
                               delay: 0,
                               usingSpringWithDamping: CGFloat(0.20),
                               initialSpringVelocity: CGFloat(6.0),
                               options: UIViewAnimationOptions.allowUserInteraction,
                               animations: {
                                sender.transform = CGAffineTransform.identity
        },
                               completion: { Void in()  }
    )
}

Answer 3

以上所有答案均有效作为一个加号，使用 Swift 我建议创建一个UIView的扩展，以“缩放”您想要的任何视图。
您可以从这段代码中获取灵感：

extension UIView {

    /**
     Simply zooming in of a view: set view scale to 0 and zoom to Identity on 'duration' time interval.

     - parameter duration: animation duration
     */
    func zoomIn(duration duration: NSTimeInterval = 0.2) {
        self.transform = CGAffineTransformMakeScale(0.0, 0.0)
        UIView.animateWithDuration(duration, delay: 0.0, options: [.CurveLinear], animations: { () -> Void in
            self.transform = CGAffineTransformIdentity
            }) { (animationCompleted: Bool) -> Void in
        }
    }

    /**
     Simply zooming out of a view: set view scale to Identity and zoom out to 0 on 'duration' time interval.

     - parameter duration: animation duration
     */
    func zoomOut(duration duration: NSTimeInterval = 0.2) {
        self.transform = CGAffineTransformIdentity
        UIView.animateWithDuration(duration, delay: 0.0, options: [.CurveLinear], animations: { () -> Void in
            self.transform = CGAffineTransformMakeScale(0.0, 0.0)
            }) { (animationCompleted: Bool) -> Void in
        }
    }

    /**
     Zoom in any view with specified offset magnification.

     - parameter duration:     animation duration.
     - parameter easingOffset: easing offset.
     */
    func zoomInWithEasing(duration duration: NSTimeInterval = 0.2, easingOffset: CGFloat = 0.2) {
        let easeScale = 1.0 + easingOffset
        let easingDuration = NSTimeInterval(easingOffset) * duration / NSTimeInterval(easeScale)
        let scalingDuration = duration - easingDuration
        UIView.animateWithDuration(scalingDuration, delay: 0.0, options: .CurveEaseIn, animations: { () -> Void in
            self.transform = CGAffineTransformMakeScale(easeScale, easeScale)
            }, completion: { (completed: Bool) -> Void in
                UIView.animateWithDuration(easingDuration, delay: 0.0, options: .CurveEaseOut, animations: { () -> Void in
                    self.transform = CGAffineTransformIdentity
                    }, completion: { (completed: Bool) -> Void in
                })
        })
    }

    /**
     Zoom out any view with specified offset magnification.

     - parameter duration:     animation duration.
     - parameter easingOffset: easing offset.
     */
    func zoomOutWithEasing(duration duration: NSTimeInterval = 0.2, easingOffset: CGFloat = 0.2) {
        let easeScale = 1.0 + easingOffset
        let easingDuration = NSTimeInterval(easingOffset) * duration / NSTimeInterval(easeScale)
        let scalingDuration = duration - easingDuration
        UIView.animateWithDuration(easingDuration, delay: 0.0, options: .CurveEaseOut, animations: { () -> Void in
            self.transform = CGAffineTransformMakeScale(easeScale, easeScale)
            }, completion: { (completed: Bool) -> Void in
                UIView.animateWithDuration(scalingDuration, delay: 0.0, options: .CurveEaseOut, animations: { () -> Void in
                    self.transform = CGAffineTransformMakeScale(0.0, 0.0)
                    }, completion: { (completed: Bool) -> Void in
                })
        })
    }

}

用法非常简单：

let button = UIButton(frame: frame)
button.zoomIn() // here the magic

Swift 3版本

extension UIView {

/**
 Simply zooming in of a view: set view scale to 0 and zoom to Identity on 'duration' time interval.

 - parameter duration: animation duration
 */
func zoomIn(duration: TimeInterval = 0.2) {
    self.transform = CGAffineTransform(scaleX: 0.0, y: 0.0)
    UIView.animate(withDuration: duration, delay: 0.0, options: [.curveLinear], animations: { () -> Void in
        self.transform = CGAffineTransform.identity
    }) { (animationCompleted: Bool) -> Void in
    }
}

/**
 Simply zooming out of a view: set view scale to Identity and zoom out to 0 on 'duration' time interval.

 - parameter duration: animation duration
 */
func zoomOut(duration: TimeInterval = 0.2) {
    self.transform = CGAffineTransform.identity
    UIView.animate(withDuration: duration, delay: 0.0, options: [.curveLinear], animations: { () -> Void in
        self.transform = CGAffineTransform(scaleX: 0.0, y: 0.0)
    }) { (animationCompleted: Bool) -> Void in
    }
}

/**
 Zoom in any view with specified offset magnification.

 - parameter duration:     animation duration.
 - parameter easingOffset: easing offset.
 */
func zoomInWithEasing(duration: TimeInterval = 0.2, easingOffset: CGFloat = 0.2) {
    let easeScale = 1.0 + easingOffset
    let easingDuration = TimeInterval(easingOffset) * duration / TimeInterval(easeScale)
    let scalingDuration = duration - easingDuration
    UIView.animate(withDuration: scalingDuration, delay: 0.0, options: .curveEaseIn, animations: { () -> Void in
        self.transform = CGAffineTransform(scaleX: easeScale, y: easeScale)
    }, completion: { (completed: Bool) -> Void in
        UIView.animate(withDuration: easingDuration, delay: 0.0, options: .curveEaseOut, animations: { () -> Void in
            self.transform = CGAffineTransform.identity
        }, completion: { (completed: Bool) -> Void in
        })
    })
}

/**
 Zoom out any view with specified offset magnification.

 - parameter duration:     animation duration.
 - parameter easingOffset: easing offset.
 */
func zoomOutWithEasing(duration: TimeInterval = 0.2, easingOffset: CGFloat = 0.2) {
    let easeScale = 1.0 + easingOffset
    let easingDuration = TimeInterval(easingOffset) * duration / TimeInterval(easeScale)
    let scalingDuration = duration - easingDuration
    UIView.animate(withDuration: easingDuration, delay: 0.0, options: .curveEaseOut, animations: { () -> Void in
        self.transform = CGAffineTransform(scaleX: easeScale, y: easeScale)
    }, completion: { (completed: Bool) -> Void in
        UIView.animate(withDuration: scalingDuration, delay: 0.0, options: .curveEaseOut, animations: { () -> Void in
            self.transform = CGAffineTransform(scaleX: 0.0, y: 0.0)
        }, completion: { (completed: Bool) -> Void in
        })
    })
}

}

Answer 4

Swift 3.x+

extension UIButton {

        func pulsate() {

            let pulse = CASpringAnimation(keyPath: "transform.scale")
            pulse.duration = 0.2
            pulse.fromValue = 0.95
            pulse.toValue = 1.0
            pulse.autoreverses = true
            pulse.repeatCount = 2
            pulse.initialVelocity = 0.5
            pulse.damping = 1.0

            layer.add(pulse, forKey: "pulse")
        }

        func flash() {

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

            layer.add(flash, forKey: nil)
        }


        func shake() {

            let shake = CABasicAnimation(keyPath: "position")
            shake.duration = 0.05
            shake.repeatCount = 2
            shake.autoreverses = true

            let fromPoint = CGPoint(x: center.x - 5, y: center.y)
            let fromValue = NSValue(cgPoint: fromPoint)

            let toPoint = CGPoint(x: center.x + 5, y: center.y)
            let toValue = NSValue(cgPoint: toPoint)

            shake.fromValue = fromValue
            shake.toValue = toValue

            layer.add(shake, forKey: "position")
        }
    }

Usage:

myButton.flash()
// myButton.pulsate()
// myButton.shake()

_{Credits: Sean Allen}

Answer 5

Swift 3版本：

    UIView.animate(withDuration: 0.6, animations: {
        button.transform = CGAffineTransform.identity.scaledBy(x: 0.6, y: 0.6)
        }, completion: { (finish) in
            UIView.animate(withDuration: 0.6, animations: {
                button.transform = CGAffineTransform.identity
            })
    })

Answer 6

它与我合作如下，动画设置为小，然后当它开始动画时，它恢复到原始大小：

button.transform = CGAffineTransformMakeScale(0.6, 0.6)

UIView.animateWithDuration(0.3, animations: { () -> Void in

    button.transform = CGAffineTransformMakeScale(1,1)

})

Answer 7

使用 Swift 4 Xcode 9 ，这会在最初按下时按下按钮，然后在释放时重新启动。

extension UIView {

func animateButtonDown() {

    UIView.animate(withDuration: 0.1, delay: 0.0, options: [.allowUserInteraction, .curveEaseIn], animations: {
        self.transform = CGAffineTransform(scaleX: 0.9, y: 0.9)
    }, completion: nil)
}

func animateButtonUp() {

    UIView.animate(withDuration: 0.1, delay: 0.0, options: [.allowUserInteraction, .curveEaseOut], animations: {
        self.transform = CGAffineTransform.identity
    }, completion: nil)
}

实现：

@IBAction func buttonTouchDown(_ sender: UIButton) {
    //Connected with Touch Down Action
    sender.animateButtonDown()
}

@IBAction func buttonTouchUpOutside(_ sender: UIButton) {
    //Connected with Touch Up Outside Action
    //if touch moved away from button
    sender.animateButtonUp()
}

@IBAction func buttonTouchUpInside(_ sender: UIButton) {
    //Connected with Touch Up Inside Action
    sender.animateButtonUp()
    //code to execute when button pressed
}

Answer 8

我更喜欢使用新闻动画并将其设置得比其他示例更快，使用完成控制等待动画结束：

Swift 3 ：

extension UIButton {
   func press(completion:@escaping ((Bool) -> Void)) {
            UIView.animate(withDuration: 0.05, animations: {
                self.transform = CGAffineTransform(scaleX: 0.8, y: 0.8) }, completion: { (finish: Bool) in
                    UIView.animate(withDuration: 0.1, animations: {
                        self.transform = CGAffineTransform.identity
                        completion(finish)
                    })
            })
    }
}

<强>用法：

@IBAction func playPauseBtnTap(_ sender: Any) {
     let playPauseBtn = sender as! UIButton
     playPauseBtn.press(completion:{ finish in
         if finish {
             print("animation ended")
         }
     }
}

Answer 9

使用以下动画，按钮将从其完整尺寸开始，使用弹簧动画减小到0.6以弹回到它的全尺寸。

[UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.4 initialSpringVelocity:0.3 options:0 animations:^{
                //Animations
                button.transform = CGAffineTransformIdentity;
                CGAffineTransformMakeScale(0.6, 0.6)
            } completion:^(BOOL finished) {
                //Completion Block
            [UIView.animateWithDuration(0.5){
            button.transform = CGAffineTransformIdentity
             }];
            }];

Answer 10

iOS 9和xCode 7

//for zoom in
    [UIView animateWithDuration:0.5f animations:^{

        self.sendButton.transform = CGAffineTransformMakeScale(1.5, 1.5);
    } completion:^(BOOL finished){}];
// for zoom out
        [UIView animateWithDuration:0.5f animations:^{

            self.sendButton.transform = CGAffineTransformMakeScale(1, 1);
        }completion:^(BOOL finished){}];

Answer 11

这将产生一种美妙的弹跳效果：

@IBAction func TouchUpInsideEvent(sender: UIButton) {
    UIView.animateWithDuration(2.0,
                               delay: 0,
                               usingSpringWithDamping: CGFloat(0.20),
                               initialSpringVelocity: CGFloat(6.0),
                               options: UIViewAnimationOptions.AllowUserInteraction,
                               animations: {
                                sender.transform = CGAffineTransformIdentity
        },
                               completion: { Void in()  }
    )
}


@IBAction func touchDownEvent(sender: UIButton) {
    UIView.animateWithDuration(0.15, animations: {
        sender.transform = CGAffineTransformMakeScale(0.6, 0.6)
    })

}

Answer 12

如果您想要一个带有完成处理程序的自动反转效果，可以试试这个。

viewToAnimate.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
        UIView.animate(withDuration: 0.7, // your duration
                       delay: 0,
                       usingSpringWithDamping: 0.2,
                       initialSpringVelocity: 6.0,
                       animations: { _ in
                       viewToAnimate.transform = .identity
            },
                       completion: { _ in
                        // Implement your awesome logic here.
        })

Answer 13

缩放按钮或任何视图大约三次或更多次使用以下代码。 swift 3或swift 4 with xcode 9。

 UIView.animate(withDuration: 0.2, animations: {
        self.cartShowHideBtnView.transform = CGAffineTransform(scaleX: 1.3, y: 1.3)

    }, completion: { (finish: Bool) in
            UIView.animate(withDuration: 0.2, animations: {
                self.cartShowHideBtnView.transform = CGAffineTransform.identity

            }, completion:{(finish: Bool) in
                UIView.animate(withDuration: 0.2, animations: {
                    self.cartShowHideBtnView.transform = CGAffineTransform(scaleX: 1.3, y: 1.3)

                }, completion: { (finish: Bool) in
                    UIView.animate(withDuration: 0.2, animations: {
                        self.cartShowHideBtnView.transform = CGAffineTransform.identity

                    }, completion:{(finish: Bool) in
                        UIView.animate(withDuration: 0.2, animations: {
                            self.cartShowHideBtnView.transform = CGAffineTransform(scaleX: 1.3, y: 1.3)

                        }, completion: { (finish: Bool) in
                            UIView.animate(withDuration: 0.2, animations: {
                                self.cartShowHideBtnView.transform = CGAffineTransform.identity
                        })
                    })
                })
            })
        })
    })

Answer 14

我使用Swift 4编写了一个协议，您可以在某些特定的UIViews上使用动画...您可以在此处尝试一些动画或更改时间和延迟。

建议采用这种方式，因为您可以在一个视图中使用此协议和其他协议，并且该视图可以使用此功能，从UIView进行很多os扩展都会产生代码味道。

import Foundation
import UIKit

protocol Showable where Self: UIView {}

extension Showable {

    func show(_ view: UIView? = nil) {

        if let view = view {
            self.animate(view)
        } else {
            self.animate(self)
        }
    }

    private func animate(_ view: UIView) {
        view.transform = CGAffineTransform(scaleX: 0.0, y: 0.0)

        UIView.animate(withDuration: 2.0,
                       delay: 0,
                       usingSpringWithDamping: CGFloat(0.20),
                       initialSpringVelocity: CGFloat(6.0),
                       options: [.allowUserInteraction],
                       animations: {
                        view.transform = CGAffineTransform.identity
        })
    }
}

Answer 15

这是一个可行的示例：

extension  UIButton{
  func flash() {
    let flash = CABasicAnimation(keyPath: "opacity")
    flash.duration = 0.5
    flash.fromValue = 1
    flash.toValue = 0.1
    flash.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
    flash.autoreverses = true
    flash.repeatCount = 3
    layer.add(flash, forKey: nil)
  }
}

@IBAction func taptosave(_ sender: UIButton) {
  sender.flash()
}

缩放UIButton动画 - Swift

15 个答案: