What is the proper way to change the UINavigationController transition effect - iphone

I have seen lots of people asking on how to push/pop UINavigationControllers using other animations besides the default one, like flip or curl.
The problem is that either the question/answer was relative old, which means the have some things like [UIView beginAnimations:] (example here) or they use two very different approaches.
The first is to use UIView's transitionFromView:toView:duration:options:completion: selector before pushing the controller (with the animation flag set to NO), like the following:
UIViewController *ctrl = [[UIViewController alloc] init];
[UIView transitionFromView:self.view
toView:ctrl.view
duration:1
options:UIViewAnimationOptionTransitionFlipFromTop
completion:nil];
[self.navigationController pushViewController:ctrl animated:NO];
Another one is to use CoreAnimation explicitly with a CATransaction like the following:
// remember you will have to have the QuartzCore framework added to your project for this approach and also add <QuartzCore/QuartzCore.h> to the class this code is used
CATransition* transition = [CATransition animation];
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
transition.duration = 1.0f;
transition.type = #"flip";
transition.subtype = #"fromTop";
[self.navigationController.view.layer removeAllAnimations];
[self.navigationController.view.layer addAnimation:transition forKey:kCATransition];
UIViewController *ctrl = [[UIViewController alloc] init];
[self.navigationController pushViewController:ctrl animated:NO];
There are pros and cons for both approaches.
The first approach gives me a much cleaner code but restricts me from using animations like "suckEffect", "cube" and others.
The second approach feels wrong just by looking at it. It starts by using undocumented transitions types (i.e. not present in the Common transition types documentation from CATransition Class Reference) which might get your app rejected from App Store (I mean might as I could not found any reference of apps being rejected because it was using this transactions, which I would also appreciate any clarification on this matter), but it gives you much more flexibility on your animations, as I can use other animation types such as "cameraIris", "rippleEffect" and so on.
Regarding all that, do I really need to appeal for QuartzCore and CoreAnimation whenever I need a fancier UINavigationController transition? Is there any other way to accomplish the same effect using only UIKit?
If not, will the use of string values like "flip" and "cube" instead of the pre-defined constants (kCATransitionFade, kCATransitionMoveIn, etc...) be an issue regarding my app approval in the App Store?
Also, are there other pros and cons regarding both approaches that could help me deciding whether to choose each one of them?

With regards to the AppStore approval, I don't think its a deal-breaker based on what animation libraries you use. You can use which ever you feel is convenient for you, and can use them together as well. From a personal standpoint, I would say the CoreAnimation & QuartzCore are pretty awesome when you are trying to add animation to a particular event. Its great because of the level of detail you can add to individual components.
But those are not your only options. You should have a look at COCOS2D libraries for animation. They are really awesome and extremely simple to use. For example if using CoreAnimation takes you 30 lines of code, you can use COCOS2D and set it up with 3-5 lines of code. Also, you can integrate Physics with each component when you use the COCOS2D framework (chipmunk).

Related

Animations during pushing view controllers to nav. controller sometimes stop working

I use this standard code many times in my app to push VCs to nav. controller.
[self.navigationController pushViewController:detailController animated:YES];
But sometimes they stop working- view controller is pushed correcty but without animation (just as i would use "animated:NO") , and i cant figure out why.
Any suggestion what to observe or try?
Whenever you use ...animated:YES/NO the Cocoa framework will determine if it can/can not do it and more often than not it just fails. Like Michael said, you might not be on the main thread or who knows what. If you look at the latest Lion API's for fullscreen animation on an NSWindow you will find various delegates for the animation failing providing details. So I wouldn't expect Apple to go back with an animator and add such functionality.
To answer your question, primarily I would use my own custom animations using Core Animations. They really are not that bad. To get you started, you can create a Category or Class Method for convenience like this:
+ (void) animateWithDuration:(NSTimeInterval)duration
animation:(void(^)())animationBlock
completion:(void(^)())completionBlock {
[NSAnimationContext runAnimationGroup:^( NSAnimationContext *context ) {
if ( duration > 0 ) [context setDuration:duration];
[context setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionDefault]];
if ( animationBlock ) animationBlock();
} completionHandler:^ {
if ( completionBlock ) completionBlock();
}];
}
You can then use it like so for several animations. Like so...
[AnimationContext animateWithDuration:myDuration animation:^{
// You can use whatever animation you want here or even nest
CABasicAnimation *fade = /* opacity animation */;
[view.layer addAnimation:fade forKey:nil];
} completion:^{
// Do some completion here.
}];
One note, you have more control over your animations this way.
Hope this answers what you are looking for.
(Huge Note, my example is for Mac OS X. On iOS the equivalent to NSAnimationContext is to wrap using CATransaction)

2 CATransition, left and right

I am trying to develop a simple CATransition that shows an UIView appearing from the left.
Here it is the code:
CATransition *transDerecha=[CATransition animation];
[transDerecha setDuration:1];
[transDerecha setStartProgress:0];
[transDerecha setType:kCATransitionMoveIn];
[transDerecha setSubtype:kCATransitionFromLeft];
[transDerecha setDelegate:self];
Ok, but to get the aspect that i am looking for, i have created a UIView (blue one on the video).
I think that in the following video, you can see better what i am trying to say.
http://screencast.com/t/JMQmxe7CGy
The problem comes when i try to make the same thing on the left. If i create another UIView to cover the left UIView, it will cover also the right cover.
So, is there any other CATransition type to make that? Or any solution?
ThankS!!!
I dont think you need to dive down to CA to do this kind of thing. It can be done using UIView animations. Here http://www.raywenderlich.com/2454/how-to-use-uiview-animation-tutorial is a good tutorial on UIView animations.

Sequential (not hierarchical) navigation in iPhone

I'm getting frustrated at this.
I want to create an iPhone application to show a list of events, one day for each 'screen'. I want a bar at the top with 'next' and 'prev' buttons that allow me to go to tomorrow or yesterday.
It is not a UINavigationController style navigation, because navigation is not hierarchical. Therefore I don't think I should use the pushViewController: method, as many examples and tutorials suggest.
I think that the appdelegate class should remove the current view and create a new viewcontroller and view and add it to the window. However I can't manage to get it working. Also I would like nice transitions.
Can someone point to a code sample that I can look at?
Thank you.
P.D. My question is similar to this one but there is no useful answer.
I wouldn't get hung up on the view controller so much. The view controller/view duality can sometimes get in the way of building custom interfaces.
What you need is a UIToolbar with two buttons, and a sorted array of UIView objects configured appropriately for your entities.
Then when the buttons are clicked, simple [UIVIew animations] should get the job done.
I'm not going to write the code for you. Any casual analysis of the build in UIView animation components will point you on your way.
The only real thing I can tell you is that, having built sophisticated interfaces for the iPhone, the biggest learning curve is knowing when and when not to use UIViewController as opposed to UIView. This is tricky because most of the standard apple components use Controller.
Now it works. Just some details were missing. I'll leave the answer here so that other people can comment on it or use it.
In the AppDelegate class I added this method:
-(void) navigateToDay:(NSDate*) newDay fromDay:(NSDate*) currentDay
{
UIViewAnimationTransition transition = ([newDay compare:currentDay]<0)? UIViewAnimationTransitionCurlDown :
UIViewAnimationTransitionCurlUp;
SequentialNavigationViewController* newController = [[SequentialNavigationViewController alloc] initWithNibName:#"SequentialNavigationViewController" bundle:nil];
newController.app = self;
newController.currentDay = newDay;
[newController.view setFrame:[[UIScreen mainScreen] applicationFrame]];
[UIView beginAnimations:#"transition" context:NULL];
[UIView setAnimationDuration:0.50];
[UIView setAnimationTransition:transition forView:self.window cache:YES];
[window addSubview:newController.view];
[self.viewController.view removeFromSuperview];
[UIView commitAnimations];
self.viewController = newController;
[newController release];
}
And I call this method from the SequentialNavigationViewController prevButtonClicked and nextButtonClicked methods.
Not so hard after all!

iPhone CATransition adds a fade to the start and end of any animation?

So I am just beginning recently developing some simple apps for the iphone. I will say that I am fairly sure I don't have a strong understanding of programming for multiple views yet, but I am trying to learn as I go.
I have a program that started as a plain window based application so i could hand write everything in hopes of learning more about what i am doing. I have a single view controller that acts to load and release views as requested from each of the other view controllers. No elements persist from one view to the other.
I have that working fine currently, but I wanted to add animations to the view changing. A simple push animation was my goal. One view pushes out as the new view pushes in.
Looking into CATransitions and trying that, I have a working version (currently for pushing top/bottom)
[thisView.view removeFromSuperview];
[thisView release];
thisView = [[MenuViewController alloc] initWithNibName:#"MenuView" bundle:nil];
[self.view addSubview:thisView.view];
CATransition *animation = [CATransition animation];
[animation setDuration:6.3];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromTop];
[animation setRemovedOnCompletion:YES];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]];
[[self.view layer] addAnimation:animation forKey:nil];
as far as I can tell this is pretty standard code for using CATransition and it works to do what I need, one view gets pushed up as the other view comes in. However my problem is that there seems to be a fade that happens to each view as they come in or go out respectively.
As such - in this example; as the menu pushes up from the bottom, it will very slowly fade in from white, and as the previous view leaves the screen it will slowly fade to white.
Note that the duration is set to 6 so that the fading is dramatic.
Is there a way to remove the fading here so that each view remains solid on the way in and the way out? Or have I missed the mark completely in this route that I am taking?
I appreciate any help. Apologies I have been long winded.
I have never been able to find a solution to this problem, but I can offer a reasonable workaround. What's happening is it isn't fading to white, but fading to transparent, and the window background (or whatever view is behind) is white. There are a couple ways to get around this:
Change the window background color. If both views you're fading between have the same solid background color, then this will look pretty good.
Don't render a background in each view ("MenuView," for example), but rather have a shared background view that's under those views at all times.
Note that this will not work in all circumstances -- grouped UITableViews, for example, are always completely opaque.
(As I side note, I assume that you aren't build a navigation-based application, in which case all the animation should be handled automatically.)
You also might want to consider the looking into the UIView method setAnimationTransition:forView:cache: if you haven't already as another way to transition between views (although it cannot do a sliding animation, if you are set on that).
I solved this by enclosing the view to which I have applied the effect into a superview and by setting the superview property "clip subviews". now the fade is "clipped" by the superview.
I was able to get the views to transition without fading at the beginning and end by using UIView animation. NOTE: In the code below, I have a UINavigationController and a UITabBarController inside a main UIView. The main UIVIew (containerView) is what I added as a subView to the Application window. The other two are subviews of the containerView.
UITabBarController *tabBarController = [(AppDelegate_iPhone *)[[UIApplication sharedApplication] delegate] tabBarController];
UIView *containerView = [(AppDelegate_iPhone *)[[UIApplication sharedApplication] delegate] containerView];
UINavigationController *accountsNavigationController = [(AppDelegate_iPhone *)[[UIApplication sharedApplication] delegate] accountsNavigationController];
CGRect accountsNavigationControllerEndFrame = containerView.frame;
CGRect tabBarControllerEndFrame = CGRectMake(containerView.frame.size.width, containerView.frame.origin.y, containerView.frame.size.width, containerView.frame.size.height);
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
tabBarController.view.frame = tabBarControllerEndFrame;
accountsNavigationController.view.frame = accountsNavigationControllerEndFrame;
[UIView commitAnimations];

How can I replicate the trashing animation of Mail.app

In my iPhone app, I have put a UIBarBUtton of type UIBarButtonSystemItemTrash in my UIToolBar. When pressed, I'd like to replicate the animation of Mail.app: the bin opens, the UIView folds and flies into it.
Is there a way to access this animation ithrough the iPhone SDK?
Presently I am using a custom made animation, but there are some limits; for example, I cannot animate the bin itself.
Do you have any suggestion? Code samples?
Cheers,
Davide
Use the suckEffect type on an animation. Also: spewEffect, genieEffect, unGenieEffect, twist, tubey, swirl, cameraIris, cameraIrisHollowClose, cameraIrisHollowOpen, rippleEffect, charminUltra, zoomyIn, and zoomyOut. Doesn't work in the simulator.
CATransition *animation = [CATransition animation];
animation.type = #"suckEffect";
animation.duration = 2.0f;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
view.opacity = 1.0f;
[view.layer addAnimation:animation forKey:#"transitionViewAnimation"];
Note: Code snippet was pulled from a larger codebase. I hope it works :)
Just to add some info:
You can use "suckEffect" with the standard +[UIView setAnimationTransition:forView:cache:]. Just pass the number 103 to the animationTransition variable. This won't avoid your app being rejected by Apple though :p
"spewEffect", "genieEffect", "unGenieEffect", etc. no longer exist on iPhoneOS 3.x. The only undocumented transition left are "cube" (--), "rippleEffect" (110), the three "cameraIris" effects (105,106,107) and "suckEffect" (103).
See http://www.iphonedevwiki.net/index.php?title=UIViewAnimationState for detail.
Also, to animate the bin (with private API): http://www.iphonedevwiki.net/index.php?title=UIToolbar#Animating_the_trash_can_icon.
Unfortunately, I think this is going to need to be an entirely custom animation. The UIView folding can be approximated using Core Animation, perhaps by adding perspective to the CATransform3D of the UIView's underlying layer to distort the UIView into a trapezoid which gets sucked into the trash can.
As far as the trash can, you can create a UIBarButtonItem using initWithCustomView:, which might let you insert a custom UIView that has an animatable trashcan. It looks like the trash can has two elements, the can base and the lid, which are rotated independently to open and close the can. Draw PNGs for both, make UIImageViews for them, and make them subviews of the UIBarButtonItem custom view. For opening and closing, apply rotational transforms to them to animate the subviews.
I'm not sure if this is an answer but here is lib that do "genie effect" so it's quite similar to what you want achieve.
CGRect endRect = CGRectMake(30, 40, 50, 60);
[view genieInTransitionWithDuration:0.7
destinationRect:endRect
destinationEdge:BCRectEdgeTop
completion:^{
NSLog(#"I'm done!");
}];