Make UIImageView Flash - Animation Block - xcode

I'm trying to make a UIImageView flash a few times when it collides with another in a small game I'm making.
I found THIS answer on this exchange and the answer that's been accepted as the best is this:
MyImage.alpha = 1.0f;
[UIView animateWithDuration:0.1f //speed of flash
delay:0.0f
options:UIViewAnimationOptionAutoreverse
animations:^ {
[UIView setAnimationRepeatCount:4.0f/2.0f]; //flash few times
MyImage.alpha = 0.0f;
} completion:^(BOOL finished) {
[MyImage removeFromSuperview];
}];
I also like edit 3's code on the 2nd answer down. However the above is the one I've been working with.
It works great but I'm having trouble having my UIImageView returning back to normal, after the flash has happened...
I've tried reseting the alpha value back to 1.0f in the completion block, and even at the end of the method I call to start the animation, but whatever I seem to be trying leaves the image invisible after the flashes... What am I missing? Thank you.
EDIT
I've also tried this way, and the image fades out and comes back, but it will only do it once :( I would like it to do it a few times:
-(void)AnimateComboFlash{ //call when collision occurs
for(int i = 1; i < 5; i++){
[self AltFlash];
}
}
-(void)AltFlash{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5f];
MyImage.alpha = 0.0f;
[UIView commitAnimations];
[self AltFlashBack];
}
-(void)AltFlashBack{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5f];
MyImage.alpha = 1.0f;
[UIView commitAnimations];
}

MyImage.alpha = 1.0f;
[UIView animateWithDuration:0.1f //speed of flash
delay:0.0f
options:UIViewAnimationOptionAutoreverse
animations:^ {
[UIView setAnimationRepeatCount:4.0f/2.0f]; //flash few times
MyImage.alpha = 0.0f;
} completion:^(BOOL finished) {
if (finished) {
[MyImage removeFromSuperview];
}
}];
You need to check if the animation is finished before you set the final value.

So after a long time reading through various questions and answers on this exchange about UIImageView animations, I finally found an answer HERE, by Enceradeira that worked for me, allowing the flash animation to happen, then the image to return to "normal" (with a full 1.0 alpha value).
Using his answer, and the code in my question, this is the method I used to make my UIImageView flash a few times, then return to it's original state:
MyImage.alpha = 1.0f;
[UIView animateWithDuration:0.1f //speed of flash
delay:0.0f
options:UIViewAnimationOptionAutoreverse
animations:^ {
[UIView setAnimationRepeatCount:4.0f/2.0f]; //flash few times
MyImage.alpha = 0.0f;
} completion:^(BOOL finished) {
//[MyImage removeFromSuperview]; //REMOVE THE REMOVE
MyImage.alpha = 1.0f; //RESET ALPHA VALUE AFTER COMPLETION
}];
Hopefully this will help some of you looking for similar answers.

Related

fade in an image in xcode automatically

Hello I am able to fade an image out automatically. How would I manage to fade the image IN automatically.
Here is my code.
.h
#property (assign) IBOutlet UIImageView *cbizFadeImage;
.m
- (void)viewDidLoad {
//Fade Image Out
CGRect aboutNicheImageFrame = cbizFadeImage.frame;
aboutNicheImageFrame.origin.y = self.view.bounds.size.height;
// iOS4+
[UIView animateWithDuration:0.5
delay:2.0
options: UIViewAnimationCurveEaseOut
animations:^{
cbizFadeImage.alpha = 0;
}
completion:^(BOOL finished){
NSLog(#"Done!");
}];
}
Ok I was able to fade an image in by changing the CurveEaseOut to CurveEaseIn. However now I would like to fade the image out. So the image would first ease in then It would then ease out. Would I use an if statement?
I was able to use the UIViewAnimationCurveEaseInOut.
Instead of UIViewAnimationCurveEaseInOut, use this for options:
options:UIViewAnimationOptionCurveEaseOut
I think what your really asking for is UIViewKeyframeAnimationOptionAutoreverse Used like this...
Image.alpha = 0;
[UIView animateKeyframesWithDuration:5.0 delay:0.0 options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat animations:^{
[UIView addKeyframeWithRelativeStartTime:0.9 relativeDuration:0.0 animations:^{
Image.alpha = 1;
}];
[UIView addKeyframeWithRelativeStartTime:0.0 relativeDuration:0.0 animations:^{
Image.alpha = 0;
}];
} completion:nil];

How can I call uianimation on imageView looks like Circle

I want to create circle uiimageview animation. When uiimage finished at self.left immediately calls again from after uiimageview.right. I want to call animation looks like but my animation was bad. Because when it finished self.left, it started self.right. :( But I want to look like image:
[ ----(end of image)--------- --------(start of image)]
Me. I did it.
[ -----(end of image)---------- ]
When finished end of image, it coming after.
My code looks like:
//for start
[UIView beginAnimations:nil context:nil];
imageView.left = - imageView.width;
// imageView2.left = - imageView.width;
[UIView setAnimationDuration:140.0];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(moveToLeft:finished:context:)];
[UIView commitAnimations];
-(void)moveToLeft:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context
{
imageView.left = self.right;
imageView2.left = self.right + 3600;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:140.0];
[UIView setAnimationDelegate:self];
imageView.left = -imageView.right;
imageView2.left = -imageView2.right;
// imageView.left = - imageView.width;
[UIView setAnimationDidStopSelector:#selector(moveToLeft:finished:context:)];
[UIView commitAnimations];
// imageView.frame.origin.x = imageView.left - self.right
}
How can i do this. Thanks
Rather than using beginAnimations, it's now recommended to use the block based approach (available on iOS4 and higher).
[UIVIew animateWithDuration:140.0 delay:0.0
options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat
animations:^(void) {
imageView.frame = CGRectMake( *Add Final position here* );
}
completion:^(BOOL finished) {}];
The options:UIViewAnimationOptionAutoreverse option will ensure that the animation goes backwards and forwards. The UIViewAnimationOptionRepeat option will keep the animation going.
Inside the block add your animation code to where the view should move. It'll then move back and forwards to that point.

Xcode: Why does my flip animation flip twice?

I'm having a little problem. I have an UILabel which have an UILongPressGestureRecognicer. When the UILongPressGestureRecognizer is called my app is supposed to switch to a new view using a flip animation.
This is the code I have used for the GestureRecognizer:
UILongPressGestureRecognizer *labelLongPressRecognizer;
labelLongPressRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:#selector(LoadLabelSettings:)];
labelLongPressRecognizer.numberOfTouchesRequired = 1;
labelLongPressRecognizer.minimumPressDuration = 2.0;
[NewLabel addGestureRecognizer:labelLongPressRecognizer];
and this is the code for the view switching animation:
CGContextRef context = UIGraphicsGetCurrentContext();
[UIView beginAnimations:nil context:context];
[UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight forView:self.view cache:NO];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:1.0];
[self.view addSubview:LabelSettingsViewController.view];
[UIView commitAnimations];
if (self.interfaceOrientation == UIInterfaceOrientationLandscapeRight || self.interfaceOrientation == UIInterfaceOrientationLandscapeLeft) {
LabelSettingsViewController.view.frame = CGRectMake(0, 0, 480, 300);
}
My problem is that when I hold down on my UILabel the switch animation begins, but when I release it repeats the animation again. So basically the animation occur twice and I only want it to take place once.
Any ideas?
Thanks in advance :)
Are you checking the sender state, e.g.,
- (void)LoadLabelSettings:(UILongPressGestureRecognizer *)sender
{
if (sender.state == UIGestureRecognizerStateEnded) // or whatever
// then do the flipping stuff
}
Check out the "Overview" of the "UILongPressGestureRecognizer Class Reference", which talks about the long press being continuous and I presume numerous events could be triggered:
http://developer.apple.com/library/ios/#DOCUMENTATION/UIKit/Reference/UILongPressGestureRecognizer_Class/Reference/Reference.html

UIImageView animated rotation

I would like to rotate an UIImageView clockwise around his center after pressing a button (360 degrees)... It should be an animation... So its getting a steering wheel, and it should rotate by itself visible for the user...
I saw there are many ways to do that, but nothing worked for me... :-)
The CABasicAnimation, do I have to add a framework for this?
Could someone give me a sample code, for rotating an UIImageView around its center for (360 degrees) that works?!?
thank you in advance
Hear given below i do same thing ...... but my requirement is when touchBegin that View will be rotate 360 degree ... it may help to you.....
- (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event {
self.userInteractionEnabled=YES;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationBeginsFromCurrentState:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self cache:YES];
[UIView commitAnimations];
[delegate changeImage:self];
}
-(void)changeImage:(DraggableImages *)selectedView
{
count++;
clickCounter++;
counterLable.text=[NSString stringWithFormat:#"%i",clickCounter];
selectedView.image=[images objectAtIndex:selectedView.tag];
if (count==1) {
firstSelectedView=selectedView;
}
if (count==2) {
self.view.userInteractionEnabled=NO;
secondSelectedView=selectedView;
count=0;
[self performSelector:#selector(compareImages) withObject:nil afterDelay:0.7];
}
}
-(void)compareImages
{
if (firstSelectedView.tag==secondSelectedView.tag)
{
matches++;
//NSLog(#"%#",matches);
Score=Score+10;
scoreLable.text=[NSString stringWithFormat:#"%d",Score];
firstSelectedView.alpha=0.5;
secondSelectedView.alpha=0.5;
self.view.userInteractionEnabled=YES;
if(matches==[images count])
{
[timer invalidate];
UIAlertView *alertView = [[UIAlertView alloc]initWithTitle:nil message:[NSString stringWithFormat:#"Do you want to countinue?"] delegate:self cancelButtonTitle:nil otherButtonTitles:#"YES",#"NO", nil];
[alertView show];
[alertView release];
}
}
else {
Score=Score-1;
scoreLable.text=[NSString stringWithFormat:#"%d",Score];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationBeginsFromCurrentState:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:firstSelectedView cache:YES];
firstSelectedView.image=[UIImage imageNamed:#"box.jpg"];
[UIView commitAnimations];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationBeginsFromCurrentState:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:secondSelectedView cache:YES];
secondSelectedView.image=[UIImage imageNamed:#"box.jpg"];
[UIView commitAnimations];
firstSelectedView.userInteractionEnabled=YES;
secondSelectedView.userInteractionEnabled=YES;
self.view.userInteractionEnabled=YES;
}
}
You need to add the QuartzCore framework, and you can read more about CABasicAnimation.
Some Tutorials
Interrupting Animation Progress
Slider Based Layer Rotation
CABasicAnimation basics
Core Animation Paths
Upon button press invoke this method:
- (void) animate{
CABasicAnimation *imageRotation = [CABasicAnimation animationWithKeyPath:#"transform.rotation"];
imageRotation.removedOnCompletion = NO; // Do not turn back after anim. is finished
imageRotation.fillMode = kCAFillModeForwards;
imageRotation.toValue = [NSNumber numberWithFloat:((360*M_PI)/180)];
imageRotation.duration = 1.5;
imageRotation.repeatCount = 1;
[yourImageView.layer setValue:imageRotation.toValue forKey:imageRotation.keyPath];
[yourImageView.layer addAnimation:imageRotation forKey:#"imageRotation"];
}
and yes as WrightsCS has stated, you will need QuartzCore framework included in your project. Dont forget the import statement:
#import <QuartzCore/QuartzCore.h>

simple UIView animation chain not working

I'm trying to slide a UIImageView into a UIView, and fade it in at the same time. And then I want it to fade and slide out.
The code below should do this, but it doesn't.
Instead, the leftArrow view is at full alpha when it slides in. So the first animation is skipping the alpha fade-in. Then the second animation just fades it out, it does not move the leftArrow view. I've tried lots of variations (using bounds instead of frames, doing the animation in a class method (as opposed to an instance method), and I cannot determine why the view seems to arbitrarily pick one thing to do rather than the other, or both.
Maybe I just need fresh eyes.
TIA,
Mike
- (void) flashHorizontalArrowsForView: (UIView *)view {
DebugLog(#" flashHorizontalArrows");
float duration = 1.5f;
// create the views
UIImageView *leftArrow = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"leftCouponDetailArrow.png"]];
leftArrow.frame = CGRectMake(0 -leftArrow.image.size.width,
HORIZONTAL_ARROW_START_Y,
leftArrow.image.size.width,
leftArrow.image.size.height);
[view addSubview:leftArrow];
leftArrow.alpha = 0.0f;
// animate them in...
[UIView beginAnimations:#"foo" context:leftArrow];
[UIView setAnimationDelay: 0.0f ]; // in seconds
[UIView setAnimationDuration: duration ];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDidStopSelector:#selector(animationReallyDidStop:finished:context:)];
[UIView setAnimationDelegate:self];
leftArrow.alpha = 1.0f;
CGRect LFrame = leftArrow.frame;
LFrame.origin.x += LFrame.size.width; // move it in from the left.
leftArrow.frame = LFrame;
[UIView commitAnimations];
// and animate them out
// delay enough for the first one to finish
[UIView beginAnimations:#"bar" context:leftArrow];
[UIView setAnimationDelay: duration+0.05 ]; // in seconds
[UIView setAnimationDuration: duration ];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[UIView setAnimationDidStopSelector:#selector(animationReallyDidStop:finished:context:)];
[UIView setAnimationDelegate:self];
leftArrow.alpha = 0.0f;
CGRect LLFrame = leftArrow.bounds;
LLFrame.origin.x -= LLFrame.size.width; // move it off to the left.
leftArrow.bounds = LLFrame;
[UIView commitAnimations];
}
Solution is simple - when the first animation finishes, have it call another method, like horizontal2, and in horizontal2, do the animate_them_out part.
- (void) flashHorizontalArrowsForView: (UIView *)view{
DebugLog(#" flashHorizontalArrows");
self.theView = view;
float duration = 1.5f;
// create the views
UIImageView *left = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"leftCouponDetailArrow.png"]];
self.leftArrow = left;
[left release];
leftArrow.tag = LEFT_ARROW_TAG;
leftArrow.frame = CGRectMake(0 -leftArrow.image.size.width,
HORIZONTAL_ARROW_START_Y,
leftArrow.image.size.width,
leftArrow.image.size.height);
[theView addSubview:leftArrow];
leftArrow.alpha = 0.0f;
UIImageView *right = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"rightCouponDetailArrow.png"]];
self.rightArrow = right;
[right release];
rightArrow.tag = RIGHT_ARROW_TAG;
rightArrow.frame = CGRectMake(view.frame.size.width, // -leftArrow.image.size.width,
HORIZONTAL_ARROW_START_Y,
leftArrow.image.size.width,
leftArrow.image.size.height);
[theView addSubview:rightArrow];
rightArrow.alpha = 0.0f;
// --------------------------------------------
// animate them in...
[UIView beginAnimations:#"foo" context:nil];
[UIView setAnimationDelay: 0.0f ]; // in seconds
[UIView setAnimationDuration: duration ];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDidStopSelector:#selector(horizontalPart2)];
[UIView setAnimationDelegate:self];
leftArrow.alpha = 1.0f;
rightArrow.alpha = 1.0f;
CGRect LFrame = leftArrow.frame;
LFrame.origin.x += LFrame.size.width; // move it in from the left.
leftArrow.frame = LFrame;
CGRect RFrame = rightArrow.frame;
RFrame.origin.x -= RFrame.size.width; // move it in from the right.
rightArrow.frame = RFrame;
[UIView commitAnimations];
}
- (void) horizontalPart2 {
// --------------------------------------------
// and animate them out
// delay enough for the first one to finish
[UIView beginAnimations:#"bar" context:nil];
[UIView setAnimationDelay: 1.0f ]; // in seconds
[UIView setAnimationDuration: 3.0f ];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[UIView setAnimationDidStopSelector:#selector(horizontalAnimationDidStop:finished:context:)];
[UIView setAnimationDelegate:self];
CGRect LLFrame = leftArrow.frame;
LLFrame.origin.x -= LLFrame.size.width; // move it off to the left. // THIS IS NOT HAPPENING.
leftArrow.frame = LLFrame;
CGRect RFrame = rightArrow.frame;
RFrame.origin.x += RFrame.size.width;
rightArrow.frame = RFrame;
leftArrow.alpha = 0.0f;
rightArrow.alpha = 0.0f;
[UIView commitAnimations];
}

Resources