Keeping a background image in the center on animation

Question

I have animation setup to resize the image to about 1.3 times it's original size. The animations and everything are working without a problem but the image is moving towards the top left. Which means that the position of the image is not centering upon resize. How do i solve this problem

These are the animations I setup

var borderWidth:CABasicAnimation = CABasicAnimation(keyPath: "borderWidth")
        borderWidth.fromValue = 0
        borderWidth.toValue = 5
        borderWidth.repeatCount = Float.infinity

        sender.layer.borderWidth = 0

        var increaseButtonHeight:CABasicAnimation = CABasicAnimation(keyPath: "bounds.size.height")
        increaseButtonHeight.fromValue = sender.frame.size.height
        increaseButtonHeight.toValue = sender.frame.size.height * 1.3

        var increaseButtonWidth: CABasicAnimation = CABasicAnimation(keyPath: "bounds.size.width")
        increaseButtonWidth.fromValue = sender.frame.size.width
        increaseButtonWidth.toValue = sender.frame.size.width * 1.3

        var boom:CAAnimationGroup = CAAnimationGroup()
        boom.animations = [borderWidth,increaseButtonWidth, increaseButtonHeight]
        boom.repeatCount = Float.infinity
        boom.duration = 0.5
        boom.autoreverses = true
        sender.layer.addAnimation(boom, forKey: "boom")

Do I need to setup a new animation for centering the button continuously as the animation happens?

Please help

Nikhil

Answer 1

Set the property contentsGravity of the layer to kCAGravityCenter