How to make a view Pulse?

Esko2300 · April 2012

Hi What i want to do is make a view appear on screen and when it does it will expand to 75,75 then shrink to 50,50 and repeat that 3 times over a period of 2 seconds.


- (void)someFunction:(UIView*)v{
NSLog(@\"%s\",__PRETTY_FUNCTION__);
    if(expandedSlideView)
        return;
        
    expandedSlideView = v;
    [expandedSlideView setCenter:self.center];
    [self addSubview:v];
    
    CABasicAnimation *pulse = [CABasicAnimation animationWithKeyPath:@\"transform.scale\"];
    pulse.duration = 2.0;
    pulse.autoreverses = YES;
    pulse.repeatCount  = 3;
    pulse.removedOnCompletion = NO;
    pulse.fromValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(75, 75, 0)];
    pulse.toValue   = [NSValue valueWithCATransform3D:CATransform3DMakeScale(50, 50, 0)];   
    [expandedSlideView.layer addAnimation:pulse forKey:@\"pulseAnimation\"];
}

This is how i am doing it and its not working. So can someone please help me understand why?

Duncan C · April 2012

Esko2300;428277 said:

Hi What i want to do is make a view appear on screen and when it does it will expand to 75,75 then shrink to 50,50 and repeat that 3 times over a period of 2 seconds.



NSLog(@\"%s\",__PRETTY_FUNCTION__);
    if(expandedSlideView)
        return;
        
    expandedSlideView = v;
    [expandedSlideView setCenter:self.center];
    [self addSubview:v];
    
    CABasicAnimation *pulse = [CABasicAnimation animationWithKeyPath:@\"transform.scale\"];
    pulse.duration = 2.0;
    pulse.autoreverses = YES;
    pulse.repeatCount  = 3;
    pulse.removedOnCompletion = NO;
    pulse.fromValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(75, 75, 0)];
    pulse.toValue   = [NSValue valueWithCATransform3D:CATransform3DMakeScale(50, 50, 0)];   
    [expandedSlideView.layer addAnimation:pulse forKey:@\"pulseAnimation\"];
}

This is how i am doing it and its not working. So can someone please help me understand why?

First of all, CATransformMakeScale takes scale numbers where 1.0 is 100% sized, .9 is 90% sized, 1.1 is 100% sized, etc. Using a scale of 75 would make the layer 75 TIMES larger than normal, which is likely not what you wanted.

This sort of thing is much easier and simpler with UIView animation.

Here's some code I wrote just the other day to make a button pulse from 100% to 110% size and back:

[UIView animateWithDuration: .5
  delay: 0.0
  options:  UIViewAnimationOptionRepeat | 
    UIViewAnimationOptionAutoreverse | 
    UIViewAnimationOptionAllowUserInteraction
  animations: ^{
    self.stopRecordingButton.transform = CGAffineTransformMakeScale(1.1, 1.1);
  }
  completion: ^(BOOL finished) {
    NSLog(@\"Stopping button animation\");
  }
];

Esko2300 · April 2012

Just threw that code into my app to see what happens. it works as i need but the view never stops pulsing after a period of time. I need it to just pulse back and forth 3 times and then set it self in the middle of the screen then when the user taps the view again it will reverse and go away. I can figure it out eventually but can you please point me in the direction as to why my code did not work. Thanks.

Duncan C · April 2012

Esko2300;428281 said:
Just threw that code into my app to see what happens. it works as i need but the view never stops pulsing after a period of time. I need it to just pulse back and forth 3 times and then set it self in the middle of the screen then when the user taps the view again it will reverse and go away. I can figure it out eventually but can you please point me in the direction as to why my code did not work. Thanks.

You need to add a call to the UIView class method setAnimationRepeatCount inside the animation block to set a repeat count. If you don't, it repeats forever.

From the docs:

setAnimationRepeatCount:
Sets the number of times animations within an animation block repeat.

+ (void)setAnimationRepeatCount:(float)repeatCount
Parameters
repeatCount
The number of times animations repeat. This value can be a fraction. If you specify the value 0, the animation is performed once without repeating.
Discussion
Use this method to specify the number of times to repeat the specified animations. This method does nothing if called from outside of an animation block. You can use this method in conjunction with either the block-based methods or the begin/commit methods for defining an animation block. If you do not explicitly set a repeat count, the animation is not repeated.

If you pass the UIViewAnimationOptionRepeat option to the animateWithDuration:delay:options:animations:completion: method without setting an explicit repeat count, the animation repeats indefinitely. If you want the animation to repeat a finite number of times, call this method from inside your block.

Esko2300 · May 2012

Thanks for your help

Punkjumper · May 2012

this thread came up in my googling last week to do exactly the same thing.
Thanks!

Duncan C · May 2012

Punkjumper;430986 said:
this thread came up in my googling last week to do exactly the same thing.
Thanks!

Reputation points are always appreciated.

Howdy, Stranger!

Forums

How to make a view Pulse?

Replies