如何为按钮制作弹跳效果

Posted 2023-03-13

【中文标题】如何为按钮制作弹跳效果

【英文标题】：How to make a bounce effect for a button

【发布时间】：2016-03-05 12:17:33

【问题描述】：

我正在尝试为视图中的按钮制作弹跳效果。我想让我的按钮做这样的事情

How to create a UIView bounce animation?

我正在使用此代码执行此操作，但它不流畅...

UIView.animateWithDuration(0.5, delay: 0.0, usingSpringWithDamping: 1, initialSpringVelocity: 1, options: [], animations: (
        self.image.center.y = self.view.frame.height / 4
    ), completion: nil)
    UIView.animateWithDuration(0.7, delay: 0.2, usingSpringWithDamping: 1, initialSpringVelocity: 0.8, options: [], animations: (
        self.image.center.y = self.view.frame.height / 6
    ), completion: nil)
    UIView.animateWithDuration(0.9, delay: 0.4, usingSpringWithDamping: 1, initialSpringVelocity: 0.6, options: [], animations: (
        self.image.center.y = self.view.frame.height / 4
    ), completion: nil)
    UIView.animateWithDuration(1, delay: 0.6, usingSpringWithDamping: 1, initialSpringVelocity: 0.4, options: [], animations: (
        self.image.center.y = self.view.frame.height / 5.5
    ), completion: nil)
    UIView.animateWithDuration(1.05, delay: 0.8, usingSpringWithDamping: 1, initialSpringVelocity: 0.2, options: [], animations: (
        self.image.center.y = self.view.frame.height / 4
    ), completion: nil)

【问题讨论】：

流体是指不连续发生吗？

你可以使用 UIView 类的方法 "+animateWithDuration:delay:usingSpringWithDamping:initialSpringVelocity:options:animations:completion:"

有很多方法可以做到这一点。 @memmons 在您发布的线程中的答案显示了使用 UIKit Dynamics 执行此操作的绝佳方法，但您不使用它。为什么不试试呢？或者，您可以使用 UIView 关键帧动画（使用方法 animateKeyframesWithDuration:delay:options:animations:completion: 和/或 animateWithDuration:delay:usingSpringWithDamping:initialSpringVelocity:options:animations:completion:。memmons 显示的 UIKit Dynamics 方法似乎最适合您所追求的效果，他提供了工作代码向您展示如何使用它。

为什么不使用您提供的 SO 链接中的代码？它似乎工作得很好。你可以用你的按钮做同样的事情。

我是 swift 新手...我不知道如何将其转换为 swift...你能帮帮我吗？ ://

【参考方案1】：

不是将所有动画都嵌套在第一个动画块中，而是将每个连续的动画放在它之前的完成处理程序中。

虽然我建议将 Core Animation 用于类似的事情，而不是 UIView animateWithDuration 方法。

【参考方案2】：

你可以使用下面的类方便使用

class BounceButton: UIButton 

    @IBInspectable var baseColor: String = "2"
        didSet 
            //layer.borderColor = borderColor.CGColor
            if baseColor == "1" 
                self.backgroundColor = UIColor.MiTheme.BtnColorPrimary
                self.setTitleColor(UIColor.white, for: .normal)
                self.titleLabel?.font = UIFont.boldSystemFont(ofSize: 17)
            
            else if baseColor == "2" 
                self.backgroundColor = UIColor.MiTheme.BtnColorSecond
                self.setTitleColor(UIColor.black, for: .normal)
            
            else if baseColor == "3" 
                self.backgroundColor = UIColor.black
                self.setTitleColor(UIColor.white, for: .normal)
                self.titleLabel?.font = UIFont.boldSystemFont(ofSize: 17)
            
            else if baseColor == "4"                 
            
        
    


    override init(frame: CGRect) 
        super.init(frame: frame)

        //self.layer.cornerRadius = 28.5

    
    required init?(coder aDecoder: NSCoder) 
        super.init(coder: aDecoder)

        //self.layer.cornerRadius = 28.5

    

    // Add some animations on button click
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) 
        super.touchesBegan(touches, with: event)

        // Scale up the button
        self.transform = CGAffineTransform(scaleX: 1.1, y: 1.1)

        UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 6, options: .allowUserInteraction, animations: 
            // Reset the sizes to defaults
            self.transform = CGAffineTransform.identity
        , completion: nil)