CODEWITHSUNDEEP
iosswiftxcodeuibutton
The Dude
The Dude

Reputation: 1118

Animating UIButton to zoom in and out on click

I got a button that I've replaced with an icon and when the icon is clicke I want it to zoom in and out for lets say 5 seconds. How can I accomplish this? I have made a set of 5 images with different sizes for the button, can I loop thru theese or is there an other way?

@IBAction func myButton(sender: UIButton){
    //animation that zoom the button icon in and out
}

Edit: Im using Xcode 6.4

Upvotes: 0

Views: 3305

Answers (2)

ronatory
ronatory

Reputation: 7324

To show an alternative, I will show an approach with animating Layers. More infos about it here

Add this code to your function (hints are in the code comments):

// specify the property you want to animate
let zoomInAndOut = CABasicAnimation(keyPath: "transform.scale")
// starting from the initial value 1.0
zoomInAndOut.fromValue = 1.0
// to scale down you set toValue to 0.5
zoomInAndOut.toValue = 0.5
// the duration for the animation is set to 1 second
zoomInAndOut.duration = 1.0
// how many times you want to repeat the animation
zoomInAndOut.repeatCount = 5
// to make the one animation(zooming in from 1.0 to 0.5) reverse to two animations(zooming back from 0.5 to 1.0)
zoomInAndOut.autoreverses = true
// because the animation consists of 2 steps, caused by autoreverses, you set the speed to 2.0, so that the total duration until the animation stops is 5 seconds
zoomInAndOut.speed = 2.0
// add the animation to your button
button.layer.addAnimation(zoomInAndOut, forKey: nil)

Result:

enter image description here

Upvotes: 9

Marco Santarossa
Marco Santarossa

Reputation: 4066

This will zoom in and out the button without using additional images:

let timer = NSTimer.scheduledTimerWithTimeInterval(5, target: self, selector: "stopButtonAnimation", userInfo: nil, repeats: false)
let options = UIViewAnimationOptions.Autoreverse | UIViewAnimationOptions.Repeat | UIViewAnimationOptions.CurveEaseInOut
UIView.animateWithDuration(0.25, delay: 0, options: options, 
animations: {
    self.button.transform = CGAffineTransformMakeScale(0.5, 0.5)
}, completion:nil)

.....

func stopButtonAnimation() {
    button.layer.removeAllAnimations;
}

Upvotes: 2

Related Questions