2015-07-09 4 views
43

Я пытаюсь сделать масштабную анимацию для UIButton, когда ее щелкнули, но то, что я пытаюсь выполнить, - это когда кнопка нажата. Мне нужно, чтобы UIButton был меньше внутри, затем он возвращается к своему такой же размер (как пузырь).Scale UIButton Animation-Swift

Я попытался следующие:

button.transform = CGAffineTransformMakeScale(-1, 1) 

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

    button.transform = CGAffineTransformMakeScale(1,1) 

}) 

ответ

102

Попробуйте

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 
     } 
    }) 
+6

Swift 3.0: UIView.animate (withDuration: 0.6, анимация: { self.button.transform = CGAffineTransform (Scalex: 0,6, у: 0,6) }, завершение: {(отделка: Bool) в UIView.animate (withDuration: 0.6, анимация: { self.button.transform = CGAffineTransform.identity }) }) – agfa555

+0

@nRewik использовали тот же самый код, но кнопка не анимацию. Пожалуйста, помогите –

5

Он работает со мной следующим образом, анимация устанавливается, чтобы быть маленьким, то, когда он начать анимацию она вернуться к своему первоначальному размеру:

button.transform = CGAffineTransformMakeScale(0.6, 0.6) 

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

    button.transform = CGAffineTransformMakeScale(1,1) 

}) 
+0

Ваш код сразу же устанавливает размер кнопки равным 0,6, а затем обновляет ее до первоначального размера. Однако, если вы хотите оживить до 0,6, а затем вернуться к исходному размеру. Проверьте мой ответ. – nRewik

+0

@nRewik, я буду проверить его :) – AaoIi

34

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() } 
    ) 
} 
+0

Я проверю! :) – AaoIi

+0

Любите его. Благодаря! –

+0

добро пожаловать @DavidDelMonte .. :) –

2

Используя следующую анимацию кнопки будет начать с его полного размера, снизится до 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 
      }]; 
      }]; 
+0

спасибо, используется для других целей – Greg

25

Все приведенные выше ответы действительны.
Как плюс, с 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 
     }) 
    }) 
} 

}

2

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){}]; 
+0

спасибо, используется для других целей – Greg

2

Это даст замечательный эффект подпрыгивая:

@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) 
    }) 

} 
13

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 
      }) 
    }) 
+0

Отлично, Спасибо, он получил работу – Sakthimuthiah

2

Вы можете попробовать это, если вы хотите AutoReverse эффект с обработчиком завершения.

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. 
     }) 
9

Swift 3.х +

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") 
     } 
    } 

Использование:

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

Кредиты: Sean Allen

4

Я предпочитаю иметь пресс анимации и установить его более быстро, чем в других примерах, с контролем завершения для ожидания окончания анимации:

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") 
     } 
    } 
} 
+1

хорошее использование завершения для запуска материала на нитке, не имея этого смешного кругового круга –

1

Scaling кнопку или любой вид примерно в три раза или более широкое использование следующего кода. swift 3 или swift 4 с 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 
         }) 
        }) 
       }) 
      }) 
     }) 
    })