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.
Related
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.
I am trying to get my image to fade out and fade in with when i click on my button. Is there something wrong with this code? My image stays visible when I click on my button.
- (IBAction)Alpha:(id)sender {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDuration:2];
_image.alpha = 1;
[UIView commitAnimations];
[UIView setAnimationDidStopSelector:#selector(animationDidStop:finished:context:)];
}
-(void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:2];
_image.alpha = 0;
[UIView commitAnimations];
}
You are calling the methods on UIVIew, the class, not on your instance of the UIImageView that you want to fade.
You'll want something like
[self.myImageView beginAnimations....
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>
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];
}
I have a UIView that contains a couple UIButtons that I am animating from offscreen to onscreen. I find that the region where they are heading is clickable before they reach it. The animation is pretty simple, so I'm wondering if there is something obvious that I am missing in terms of telling the code to not treat the button as if it is at the final destination (I'm not sure if that is supposed to be the expected behavior and the animation is purely a visual while the clickable region is instantaneously at the destination; I wouldn't expect it to be).
Here is the code I use to animate it. It's basically switching out a sub panel and bringing back a main panel with buttons:
// switch back to main abilities panel
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: kFadeInTime];
CGRect rect = CGRectMake(
480.0f,
mAbilities.mSubPanel.frame.origin.y,
mAbilities.mSubPanel.frame.size.width,
mAbilities.mSubPanel.frame.size.height);
mAbilities.mSubPanel.frame = rect;
[UIView commitAnimations];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: kFadeInTime];
[UIView setAnimationDelay: kFadeInTime];
rect = CGRectMake(
kAbilitiesBorderX,
mAbilities.mPanel.frame.origin.y,
mAbilities.mPanel.frame.size.width,
mAbilities.mPanel.frame.size.height);
mAbilities.mPanel.frame = rect;
[UIView commitAnimations];
As a workaround you can disable user interaction with your panel before animations and reenable it when animation finishes:
// Animation compete handler
- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context{
mAbilities.mSubPanel.userInteractionEnabled = YES;
}
// Animating panel
mAbilities.mSubPanel.userInteractionEnabled = NO;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: kFadeInTime];
[UIView setAnimationDelegate: self];
CGRect rect = CGRectMake(
480.0f,
mAbilities.mSubPanel.frame.origin.y,
mAbilities.mSubPanel.frame.size.width,
mAbilities.mSubPanel.frame.size.height);
mAbilities.mSubPanel.frame = rect;
[UIView commitAnimations];
If you're targeting iOS4 you can (and as specs say should) use block-based animation api:
[UIView animateWithDuration:5.0f delay:0.0f options:UIViewAnimationOptionLayoutSubviews
animations:^(void){
CGRect rect = CGRectMake(
480.0f,
mAbilities.mSubPanel.frame.origin.y,
mAbilities.mSubPanel.frame.size.width,
mAbilities.mSubPanel.frame.size.height);
mAbilities.mSubPanel.frame = rect;
}
completion:NULL
];
While animating using blocks user interaction is disabled by default - you can enable it by setting UIViewAnimationOptionAllowUserInteraction flag in options parameter:
... options:UIViewAnimationOptionLayoutSubviews | UIViewAnimationOptionAllowUserInteraction ...