I am using this code to for flip transition.
MyViewController *viewController = [[MyViewController alloc] init];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:YES];
[self.navigationController pushViewController:viewController animated:NO];
[UIView commitAnimations];
[viewController release];
But instead of fliping from right, its flipping from top. My application works only in landscape mode.
Please help.
I don't know what Apple was thinking when they developed this API. Here's the workaround I used:
// Assume this code is in a view controller subclass
- (UIViewAnimationOptions)viewAnimationOptionTransitionFlipFromRight
{
switch (self.interfaceOrientation) {
case UIInterfaceOrientationPortrait:
return UIViewAnimationOptionTransitionFlipFromRight;
case UIInterfaceOrientationLandscapeLeft:
return UIViewAnimationOptionTransitionFlipFromBottom;
case UIInterfaceOrientationLandscapeRight:
return UIViewAnimationOptionTransitionFlipFromTop;
case UIInterfaceOrientationPortraitUpsideDown:
return UIViewAnimationOptionTransitionFlipFromLeft;
}
}
You can adjust the code accordingly if you want to flip in a different direction. If you want to use the page curl transitions, however, I'm afraid you may be completely out of luck.
The animation constants have been defined with portrait mode in mind. If you define your application to be landscape mode only, you have to think about these animation constants with your head tilted 90 degrees.
Let's say your device's top is titled to the left, than you would set the animation with
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.navigationController.view cache:YES];
and it would curl from the right. That's because the bottom of the device faces to the right in this case.
The bad thing is that UIViewAnimationTransitionFlipFromBottom is not defined. I guess you could rotate the coordinate system of the animation with 90 degrees, but I can't help you with that.
Related
i am working with page curling effect .on click of a button i was able to transit the page(i.e between the UIViews).the following code depicts the same
UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.5];
if ([sender tag] == 1) {
[UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:placeholder cache:YES];
}
else {
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:placeholder cache:YES];
}
if (view1OnTop) {
[view1 removeFromSuperview];
[placeholder addSubview:view2];
}
else {
[view2 removeFromSuperview];
[placeholder addSubview:view1];
}
[UIView commitAnimations];
view1OnTop = !view1OnTop;
with this i was able to curl between UIViews ,but my question is , will i be able to apply this kind of transition between two or more classes???
thanks in advance
Not everything is animatable. Only parts of UIKit are. So if you mean to ask if any subclass of NSObject can be animated then no they can't. If you mean to ask if whether subclasses of UIView can be animated then the answer would be yes. They can be different subclasses too. While this is possible, it doesn't mean it will give us the right results. They might end up looking pretty weird. You might not want to do that.
Layers are animatable too.
However it all depends on what you mean by classes.
Animating to a new view controller
Say you want to alter the way you shift between view controllers, you can use transitionWithView:duration:.. class method of UIView. An example,
SecondViewController * viewController = [[[SecondViewController alloc] initWithNibName:nil bundle:nil] autorelease];
[UIView transitionWithView:self.view.window
duration:1.0f
options:UIViewAnimationOptionTransitionCurlUp
animations:^{
[self.navigationController pushViewController:viewController animated:NO];
}
completion:NULL];
This will use the curl up transition when pushing the new view controller.
For iOS versions older than 4.0
Since they don't support block based animation APIs, you will have to do this,
[UIView beginAnimations:#"Curl up" context:NULL];
[UIView setAnimationDuration:1.0f];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view.window cache:YES];
[self.navigationController pushViewController:viewController animated:NO];
[UIView commitAnimations];
I want to show a custom animation when pushing a view controller: I would like to achieve something like an "expand" animation, that means the new view expands from a given rectangle, lets say [100,100 220,380] during the animation to full screen.
Any suggestions where to start, respectively any documents, tutorials, links? :)
Alright. I could make the expand animation with the following code:
if ([coming.view superview] == nil)
[self.view addSubview:coming.view];
coming.view.frame = CGRectMake(160,160,0,0);
[UIView beginAnimations:#"frame" context:nil];
[UIView setAnimationDuration:4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[coming viewWillAppear:YES];
[going viewWillAppear:YES];
coming.view.frame = CGRectMake(0, 0, 320, 480);
[going viewDidDisappear:YES];
[coming viewDidAppear:YES];
[UIView commitAnimations];
My View is properly displayed, but unfortunately the navigation bar is not updated. Is there a way to do that manually?
In the sample code, a function is called all 0.03 seconds that updates the transformation of the view.
Unfortunately, when pushing a UIViewController, I am not able to resize the frame of the view ... am I ?
I use the following function (added to UINavigationController) to customize the push animation:
- (void) pushController: (UIViewController*) controller
withTransition: (UIViewAnimationTransition) transition
{
[UIView beginAnimations:nil context:NULL];
[self pushViewController:controller animated:NO];
[UIView setAnimationDuration:.5];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:transition forView:self.view cache:YES];
[UIView commitAnimations];
}
I guess you could adapt this code to do whatever animation you want.
The code which you are looking for:
[UIView beginAnimations:#"View Flip" context:nil];
[UIView setAnimationDuration:0.80];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationTransition:
UIViewAnimationTransitionFlipFromRight
forView:self.navigationController.view cache:NO];
[self.navigationController pushViewController:menu animated:YES];
[UIView commitAnimations];
What you could do is push the next view controller but don't animate it, like so:
[self.navigationController pushViewController:nextController animated:NO];
...and then, in the view controller that is getting pushed in, you could do a custom animation of it's view using CoreAnimation. This might be best done in the viewDidAppear:(BOOL)animated method.
Check out the Core Animation Guide on how to actually do the animation. Look particularly at the implicit animation.
EDIT: updated link
#zoul: That worked great! I just changed "self" to "self.navigationController" and "self.view" to "self.navigationController.view" Don't know if that was necessary, but it worked. And #crafterm, as for popping back, just make your own leftBarButtonItem by adding this code in viewDidLoad or ViewWillAppear:
//add your own left bar button
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:#"Back" style:UIBarButtonItemStylePlain target:self action:#selector(backButtonTapped)];
self.navigationItem.leftBarButtonItem = backButton;
[backButton release];
Then I just tweaked the push function and made this popWithTransition function that I called in my -backButtonTapped method.
- (void) popWithTransition: (UIViewAnimationTransition) transition
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:.75];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:transition forView:self.navigationController.view cache:YES];
[UIView commitAnimations];
[self.navigationController popViewControllerAnimated:NO];
}
Note that the popViewController call got shifted down to the end, after the animation. Don't know if that's kosher, but again, it worked.
What you want is the downloads for chapter 2 of iphone developers cookbook. Look at the affineRotate sample specifically, although any of the core animatin samples will help you.
Have a look at ADTransitionController, a drop in replacement for UINavigationController with custom transition animations (its API matches the API of UINavigationController) that we created at Applidium.
You can use different pre-defined animations for push and pop actions such as Swipe, Fade, Cube, Carrousel and so on. In your case, the animation you are requesting is the one called Zoom.
I am nearly finished with my first IPhone app and everything works fine - except of one very little display bug:
My starscreen is an UIView (Fullscreen) without Navigationbar or Toolbar.
If I tap on a start button, there is an UIViewAnimationTransitionFlipFromRight animation that flips to the main navigation controller:
-(IBAction) switchViewToMainMenu {
[UIView beginAnimations:#"Flip View" context:nil];
[UIView setAnimationDuration:1.25];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight forView:self.window cache:YES];
[self.navController viewWillAppear:YES];
[self.startScreenViewController viewWillDisappear:YES];
[self.startScreenViewController.view removeFromSuperview];
[self.window addSubview:navController.view];
[self.startScreenViewController viewDidDisappear:YES];
[self.navController viewDidAppear:YES];
[UIView commitAnimations];
self.startScreenViewController=nil;
[startScreenViewController release];
}
This works fine except of one little problem:
When the navigation controller view appears (flips in), the Navigationbar on top is some pixels too high (the is a white bar where the Navigationbar should be). When the animation finished, the Navigationbar drops down to the right position. This doesn't look very beautiful...
Any ideas how to fix that problem ?
We found a solution using the setAnimationDelay giving some time the tabbar to load and placed in view.
Thought you have to alter the code a little in order to use the setAnimationDelay.
You have to use the setyanimationdelay just before the setanimationtransition and the setanimationtransition just before the commitAnimations. So the code above should end to:
[UIView setAnimationDelay:2]; // 2 seconds delay seems to be working for us
[UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight forView:self.window cache:YES];
[UIView commitAnimations];
I want to show a custom animation when pushing a view controller: I would like to achieve something like an "expand" animation, that means the new view expands from a given rectangle, lets say [100,100 220,380] during the animation to full screen.
Any suggestions where to start, respectively any documents, tutorials, links? :)
Alright. I could make the expand animation with the following code:
if ([coming.view superview] == nil)
[self.view addSubview:coming.view];
coming.view.frame = CGRectMake(160,160,0,0);
[UIView beginAnimations:#"frame" context:nil];
[UIView setAnimationDuration:4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[coming viewWillAppear:YES];
[going viewWillAppear:YES];
coming.view.frame = CGRectMake(0, 0, 320, 480);
[going viewDidDisappear:YES];
[coming viewDidAppear:YES];
[UIView commitAnimations];
My View is properly displayed, but unfortunately the navigation bar is not updated. Is there a way to do that manually?
In the sample code, a function is called all 0.03 seconds that updates the transformation of the view.
Unfortunately, when pushing a UIViewController, I am not able to resize the frame of the view ... am I ?
I use the following function (added to UINavigationController) to customize the push animation:
- (void) pushController: (UIViewController*) controller
withTransition: (UIViewAnimationTransition) transition
{
[UIView beginAnimations:nil context:NULL];
[self pushViewController:controller animated:NO];
[UIView setAnimationDuration:.5];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:transition forView:self.view cache:YES];
[UIView commitAnimations];
}
I guess you could adapt this code to do whatever animation you want.
The code which you are looking for:
[UIView beginAnimations:#"View Flip" context:nil];
[UIView setAnimationDuration:0.80];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationTransition:
UIViewAnimationTransitionFlipFromRight
forView:self.navigationController.view cache:NO];
[self.navigationController pushViewController:menu animated:YES];
[UIView commitAnimations];
What you could do is push the next view controller but don't animate it, like so:
[self.navigationController pushViewController:nextController animated:NO];
...and then, in the view controller that is getting pushed in, you could do a custom animation of it's view using CoreAnimation. This might be best done in the viewDidAppear:(BOOL)animated method.
Check out the Core Animation Guide on how to actually do the animation. Look particularly at the implicit animation.
EDIT: updated link
#zoul: That worked great! I just changed "self" to "self.navigationController" and "self.view" to "self.navigationController.view" Don't know if that was necessary, but it worked. And #crafterm, as for popping back, just make your own leftBarButtonItem by adding this code in viewDidLoad or ViewWillAppear:
//add your own left bar button
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:#"Back" style:UIBarButtonItemStylePlain target:self action:#selector(backButtonTapped)];
self.navigationItem.leftBarButtonItem = backButton;
[backButton release];
Then I just tweaked the push function and made this popWithTransition function that I called in my -backButtonTapped method.
- (void) popWithTransition: (UIViewAnimationTransition) transition
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:.75];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:transition forView:self.navigationController.view cache:YES];
[UIView commitAnimations];
[self.navigationController popViewControllerAnimated:NO];
}
Note that the popViewController call got shifted down to the end, after the animation. Don't know if that's kosher, but again, it worked.
What you want is the downloads for chapter 2 of iphone developers cookbook. Look at the affineRotate sample specifically, although any of the core animatin samples will help you.
Have a look at ADTransitionController, a drop in replacement for UINavigationController with custom transition animations (its API matches the API of UINavigationController) that we created at Applidium.
You can use different pre-defined animations for push and pop actions such as Swipe, Fade, Cube, Carrousel and so on. In your case, the animation you are requesting is the one called Zoom.
how can I implement the animation we see in the iPhone Music app's coverflow screen? when you click on a small view, it flips and scales up to another view? how can I do this? I can use core animation to flip and scale a view, but how can I do the transition to another view? thanks
You need an UIView as Container for the two UIViews (frontside/backside) and then remove/add these from/to the container as subviews while doing the animations in between:
UIView *flipContainer;
UIView *frontSide;
UIView *backSide;
//...
-(void)turnUp
{
[backSide removeFromSuperview];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:flipContainer cache:YES];
[UIView setAnimationDuration:1.0];
CGAffineTransform transform = CGAffineTransformMakeScale(1.2, 1.2);
flipContainer.transform = transform;
[UIView commitAnimations];
[flipContainer addSubview:frontSide];
}
-(void)turnDown
{
[frontSide removeFromSuperview];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:flipContainer cache:YES];
[UIView setAnimationDuration:1.0];
CGAffineTransform transform = CGAffineTransformMakeScale(1, 1);
flipContainer.transform = transform;
[UIView commitAnimations];
[flipContainer addSubview:backSide];
}
I'm trying the exact code you are doing - I get a zoom effect but no turn over. The only difference is that right before the turnUp code I add the flipContainer (with back showing) so then it can be flipped over.
// construct animation container
self.flipContainer = [[FlipContainer alloc] init];
[self.flipContainer.view setFrame:CGRectMake(clickedSquareX, clickedSquareY, 200, 200)];
[self.flipContainer.view addSubview:self.backside.view];
// add animation container
[self.myParentView.view addSubview:self.flipContainer.view];
// PROCEED to your turnUp code
The reason I'm doing this is I have a bunch of images in a horizontal UIScrollView and so to 'simulate' a 200x200 image flipping over and zooming to show detail I add my flipContainer with the backside showing the exact image over the exact spot of the pressed image. It should work shouldn't it? A bit confusing to me is the first line of your turnUp code you do:
[backSide removeFromSuperview];
..which would remove the view I just added.
I'm not sure if this is the right spot to put this question in - sorry if it isn't!