iPhone page curl transition animation - iphone

I'm trying to instigate a page curl transition with a UIImageView in a Window. This code is in my main init method :
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.5];
[UIView setAnimationDelay:delay];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDidStopSelector:#selector(animCompleteHandler:finished:context:)];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:splashImage cache:YES];
splashImage.frame = CGRectMake(-320, 0, 10, 10);
//[splashImage removeFromSuperview];
[UIView commitAnimations];
The image animates position and size but no curl. If I uncomment the removeFromSuperView it just vanishes instantly. Any ideas?
UPDATE:
Have changed the code so it uses Lars fantasticlly neat way of triggering an animation and including the animation and callback ...
[UIView animateWithDuration:1.5
delay:delay
options: UIViewAnimationTransitionCurlUp
animations:^{splashImage.alpha = 0;}
completion:^(BOOL finished){[splashImage removeFromSuperview];}
];
Unfortunately the page curl just doesn't happen. It does fade though.
I'm not sure if this is something to do with the syntax or the fact that the SplashImage is a UIImageView class in the UIWindow object of my main view. Maybe it needs to be in a UIView to create the transition.

Try something like:
[UIView transitionWithView:splashImage
duration:1.5
options: UIViewAnimationOptionTransitionCurlUp
animations^{
splashImage.frame = CGRectMake(-320, 0, 10, 10);
}
completion:^(BOOL finished){
[splashImage removeFromSuperview];
//animCompleteHandlerCode..
}
];
Not tested and maybe some syntax errors but give it a try!
Or maybe this is better:
[UIView animateWithDuration:1.5
delay:delay
options: UIViewAnimationOptionTransitionCurlUp
animations^{
splashImage.frame = CGRectMake(-320, 0, 10, 10);
}
completion:^(BOOL finished){
[splashImage removeFromSuperview];
//animCompleteHandlerCode..
}
];

#Larsaronen: Thanks for the examples, it was exactly what I needed! I just wanted a simple page curl while images are first displayed, so I used an alpha of 1.0 instead of 0, and set the completion callback to nil:
// set a page curl animation for the specified UIImageView control
- (void) setAnimationPageCurl:(UIImageView *)imageView {
[UIView transitionWithView:imageView
duration:1.5
options:UIViewAnimationOptionTransitionCurlDown
animations:^ { imageView.alpha = 1.0; }
completion:nil];
}

Related

iOS 6.1 animation not working

The following method that i created for animation:
-(void)shakingAnimationForGate:(UIImageView *)image leftShaking:(CGAffineTransform)leftTransform rightShaking:(CGAffineTransform)rightTransform animationName:(NSString *)string{
[UIView animateWithDuration:5.0
delay:0.5
options: UIViewAnimationOptionCurveEaseOut
animations:^{
image.transform = leftTransform; // starting point
[UIView beginAnimations:string context:(__bridge void *)(image)];
[UIView setAnimationRepeatAutoreverses:YES]; // important
[UIView setAnimationRepeatCount:20];
[UIView setAnimationDelay:0.1];
[UIView setAnimationDuration:0.06];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(shakeEnded:finished:context:)];
image.transform = rightTransform; // end here & auto-reverse
[UIView commitAnimations];
}
completion:^(BOOL finished){
NSLog(#"end of shaking");
}];
}
which makes UIView do the "shaking".
Then i'm using this method:
CGAffineTransform leftShake = CGAffineTransformMakeTranslation(-2, 6);
CGAffineTransform rightShake = CGAffineTransformMakeTranslation(0, 3);
[self shakingAnimationForGate:imageLeft leftShaking:leftShake rightShaking:rightShake animationName:#"left view shake"];
where imageLeft is UIImageView.
So my problem is that this method don't do animation of shaking on iOS 6.1. It's working fine on iOS 7 though. Any ideas what's the problem?
When compiling, Xcode optimises your code a little. For example if you execute the following code, only the last line is executed:
[self.view setBackgroundColor:[UIColor greenColor]];
[self.view setBackgroundColor:[UIColor yellowColor]];
Most likely that's the case with the animation as well.
Move the revert part to the completion part.

Animation to Hide UIButton in iOS

In my application i want to give an animation to UIButtons, like the buttons will "fall out" of the screen when they hide.
I tried the following code but it didn't give me a good result.
[UIView animateWithDuration:1.5
animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
}];
[S1Button setHidden:YES];
break;
You can set new position and hide the button after animation.
[UIView animateWithDuration:0.9 animations:^{
tradeButton.frame = (CGRect){ CGPointMake(51, 150), tradeButton.bounds.size };
} completion:^(BOOL finished) {
tradeButton.hidden = YES;
// etc.
}];
Use the animation method which has a completion block and hide the button there. Currently your hide method runs immediately so you don't see the animation.
[UIView animateWithDuration:1 animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
} completion:^(BOOL finished) {
[S1Button setHidden:YES];
}]
Try this one
To fade out:
[UIView animateWithDuration:0.3 animations:^{
button.alpha = 0;
} completion: ^(BOOL finished) {
button.hidden = YES;
}];
To fade in:
button.alpha = 0;
button.hidden = NO;
[UIView animateWithDuration:0.3 animations:^{
button.alpha = 1;
}];
[UIView animateWithDuration:0.25f
animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
}completion:^(BOOL completed){
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:.3];
S1Button.alpha = 1;
[UIView commitAnimations];
}];
In your Code, The hidden property of Button is NOT animatable. When this animation block runs, your button will immediately hidden , but it will not fade/animate. The appropriate way to fade out a UIView is to animate its alpha property from 1.0 to 0.0 like this:
[UIView animateWithDuration:2.0
delay:0.0
options: UIViewAnimationCurveEaseOut
animations:^{S1Button.frame = CGRectMake(20, 10, 50, 10);S1buttonA.alpha = 0;}
completion:nil];
try this:
you hide the button before your animation completion, the no animation is visible. So, replace your code with this:
[UIView animateWithDuration:1.5 animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
} completion:^(BOOL finished) {
[S1Button setHidden:YES];
}];
break;

How to get animation end notification

I want to do some action once animation ended.
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.80f];
self.view.transform =
CGAffineTransformMakeTranslation(
self.view.frame.origin.x,
480.0f + (self.view.frame.size.height/2) // move the whole view offscreen
);
[self.view setAlpha:0];
[UIView commitAnimations];
I have done animation like above, How to find out animation ended, so that I can do my action after that.
Use this:
[UIView animateWithDuration:0.80f animations:^{
self.view.transform =
CGAffineTransformMakeTranslation(
self.view.frame.origin.x,
480.0f + (self.view.frame.size.height/2) // move the whole view offscreen
);
[self.view setAlpha:0];
}
completion:^(BOOL finished){
// your code
}];
Add this to your animation:
[UIView setAnimationDidStopSelector:#selector(myAnimationEnded)];
[UIView setAnimationDelegate:self];
and this method will tell you when it stops;
- (void)myAnimationEnded{
NSLog(#"animation ended");
}
Use the UIView's -animateWithDuration:animations:completion: class method.
[UIView animateWithDuration:0.8 animations:^{
CGAffineTransformMakeTranslation(
self.view.frame.origin.x,
480.0f + (self.view.frame.size.height/2) // move the whole view offscreen
);
[self.view setAlpha:0];
} completion:^(BOOL finished) {
//this block is called when the animation is over
}];
Write your code after [UIView commitAnimations];. The animation remains between the beginAnimations and the commitAnimations.
Not that setAnimationDelegate
Use of this method is discouraged in iOS 4.0 and later. If you are using the block-based animation methods, you can include your delegate’s start and end code directly inside your block.

Scaling a UIView during transitionFromView?

I'm using a container UIView to replicate the kind of behavior the iTunes store does when you tap on album artwork and it flips and scales.
Current code looks like:
//mainView is 300x300x, smallView is 30x30
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:2.0];
[UIView transitionFromView:mainView toView:smallView duration:3.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];
containerView.frame = CGRectMake(275, 415, 30, 30);
[UIView commitAnimations];
I can't seem to get the content of the containerView to scale during the animation, the frame just closes in on the content. I tried applying some transforms to both the view and the layers and a bunch of other things but I can't seem to get it to behave properly.
Rather than setting the frame, try using a transform instead:
- (void)setStartTransform:(CGAffineTransform)transform;
- (void)setEndTransform:(CGAffineTransform)transform;
Something like
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:2.0];
[UIView transitionFromView:mainView toView:smallView duration:3.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];
//containerView.frame = CGRectMake(275, 415, 30, 30);
[containerView setStartTransform: CGAffineTransformIdentity];
[containerView setEndTransform: CGAffineTransformMakeScale(0.1, 0.1)];
[UIView commitAnimations];
(You might need to apply a translate to the transform too.)
Try it this way:
[UIView transitionWithView:mainView
duration:0.2
options:UIViewAnimationOptionTransitionFlipFromLeft
animations:^{
containerView.frame = CGRectMake(275, 415, 30, 30)
}
completion:NULL];

Is it possible to removeFromSuperview with Animation?

I have 2 layer is top and bottom on my program
how can i remove top layer with animation or bring top layer to back is it possible?
The easiest is playing with frame and alpha before removing it.
You can get some cool effects
-(void)removeWithEffect:(UIView *)myView
{
[UIView beginAnimations:#"removeWithEffect" context:nil];
[UIView setAnimationDuration:0.5f];
//Change frame parameters, you have to adjust
myView.frame = CGRectMake(0,0,320,480);
myView.alpha = 0.0f;
[UIView commitAnimations];
[myView performSelector:#selector(removeFromSuperview) withObject:nil afterDelay:0.5f];
}
iOS Update
You can now use blocks to perform your animation
[UIView animateWithDuration:0.5f
animations:^{view.alpha = 0.0;}
completion:^(BOOL finished){ [view removeFromSuperview]; }];
If you're targetting iOS 4.0 upwards you can use animation blocks:
[UIView animateWithDuration:0.2
animations:^{view.alpha = 0.0;}
completion:^(BOOL finished){ [view removeFromSuperview]; }];
(above code comes from Apple's UIView documentation)