I have a view controller navigation hierarchy where only the top view controller hides has its navigation bar hidden. Normal pushing/popping is fine and works as expected. However, when the pop is interactive (drag-to-pop), the top opaque bar doesn't disappear until the transition is finished. I've implemented the logic in the following delegate call:
- (void)navigationController:(UINavigationController *)navigationController willShowViewController:(UIViewController *)viewController animated:(BOOL)animated {
if( [viewController isKindOfClass:[MyTopViewController class]] == YES ) {
id<UIViewControllerTransitionCoordinator> transitionCoordinator = viewController.transitionCoordinator;
if( transitionCoordinator != nil && transitionCoordinator.initiallyInteractive == YES ) {
[transitionCoordinator notifyWhenInteractionEndsUsingBlock:^(id<UIViewControllerTransitionCoordinatorContext> _Nonnull context) {
if( context.isCancelled == YES ) {
return;
}
[navigationController setNavigationBarHidden:YES animated:animated];
}];
} else {
[navigationController setNavigationBarHidden:YES animated:animated];
}
} else {
[navigationController setNavigationBarHidden:NO animated:animated];
}
}
I've already attempted numerous variations of this, but each one has had various issues with interactive transitions, especially if the transition is canceled mid-way. What's the best way to approach this?
I want to recreate the search UI shown in the iOS 7/8 calendar app. Presenting the search UI modally isn't a problem. I use UISearchController and modally present it just like the UICatalog sample code shows which gives me a nice drop down animation. The issue comes when trying to push a view controller from the results view controller. It isn't wrapped in a navigation controller so I can't push onto it. If I do wrap it in a navigation controller then I don't get the default drop down animation when I present the UISearchController. Any ideas?
EDIT:
I got it to push by wrapping my results view controller in a nav controller. However the search bar is still present after pushing the new VC onto the stack.
EDIT (2):
DTS from Apple said that the calendar app uses a non-standard method to push from search results. Instead they recommend removing focus from the search controller then pushing and returning focus on pop. This is similar to the way search in the settings app works I imagine.
Apple has gotten very clever there, but it's not a push, even though it looks like one.
They're using a custom transition (similar to what a navigation controller would do) to slide in a view controller which is embedded in a navigation controller.
You can spot the difference by slowly edge-swiping that detail view back and letting the previous view start to appear. Notice how the top navigation slides off to the right along with the details, instead of its bar buttons and title transitioning in-place?
Update:
The problem that you're seeing is that the search controller is presented above your navigation controller. As you discovered, even if you push a view controller onto a navigation controller's stack, the navigation bar is still beneath the search controller's presentation, so the search bar obscures any (pushed view controller's) navigation bar.
If you want to show results on top of the search controller without dismissing it, you'll need to present your own modal navigation view controller.
Unfortunately, there's no transition style which will let you present your navigation controller the same way the built-in push animation behaves.
As I can see, there are three effects that need to be duplicated.
The underlying content dims, as the presented view appears.
The presented view has a shadow.
The underlying content's navigation completely animates off-screen, but its content partially animates.
I've reproduced the general effect within an interactive custom modal transition. It generally mimic's Calendar's animation, but there are some differences (not shown), such as the keyboard (re)appearing too soon.
The modal controller that's presented is a navigation controller. I wired up a back button and edge swipe gesture to (interactively) dismiss it.
Here are the steps that are involved:
In your Storyboard, you would change the Segue type from Show Detail to Present Modally.
You can leave Presentation and Transition set to Default, as they'll need to be overridden in code.
In Xcode, add a new NavigationControllerDelegate file to your project.
NavigationControllerDelegate.h:
#interface NavigationControllerDelegate : NSObject <UINavigationControllerDelegate>
NavigationControllerDelegate.m:
#interface NavigationControllerDelegate () <UIViewControllerTransitioningDelegate>
#property (nonatomic, weak) IBOutlet UINavigationController *navigationController;
#property (nonatomic, strong) UIPercentDrivenInteractiveTransition* interactionController;
#end
- (void)awakeFromNib
{
UIScreenEdgePanGestureRecognizer *panGestureRecognizer = [[UIScreenEdgePanGestureRecognizer alloc] initWithTarget:self action:#selector(handlePan:)];
panGestureRecognizer.edges = UIRectEdgeLeft;
[self.navigationController.view addGestureRecognizer:panGestureRecognizer];
}
#pragma mark - Actions
- (void)handlePan:(UIScreenEdgePanGestureRecognizer *)gestureRecognizer
{
UIView *view = self.navigationController.view;
if (gestureRecognizer.state == UIGestureRecognizerStateBegan)
{
if (!self.interactionController)
{
self.interactionController = [UIPercentDrivenInteractiveTransition new];
[self.navigationController dismissViewControllerAnimated:YES completion:nil];
}
}
else if (gestureRecognizer.state == UIGestureRecognizerStateChanged)
{
CGFloat percent = [gestureRecognizer translationInView:view].x / CGRectGetWidth(view.bounds);
[self.interactionController updateInteractiveTransition:percent];
}
else if (gestureRecognizer.state == UIGestureRecognizerStateEnded)
{
CGFloat percent = [gestureRecognizer translationInView:view].x / CGRectGetWidth(view.bounds);
if (percent > 0.5 || [gestureRecognizer velocityInView:view].x > 50)
{
[self.interactionController finishInteractiveTransition];
}
else
{
[self.interactionController cancelInteractiveTransition];
}
self.interactionController = nil;
}
}
#pragma mark - <UIViewControllerAnimatedTransitioning>
- (id<UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)__unused presented presentingController:(UIViewController *)__unused presenting sourceController:(UIViewController *)__unused source
{
TransitionAnimator *animator = [TransitionAnimator new];
animator.appearing = YES;
return animator;
}
- (id<UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)__unused dismissed
{
TransitionAnimator *animator = [TransitionAnimator new];
return animator;
}
- (id<UIViewControllerInteractiveTransitioning>)interactionControllerForPresentation:(id<UIViewControllerAnimatedTransitioning>)__unused animator
{
return nil;
}
- (id<UIViewControllerInteractiveTransitioning>)interactionControllerForDismissal:(id<UIViewControllerAnimatedTransitioning>)__unused animator
{
#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wgnu-conditional-omitted-operand"
return self.interactionController ?: nil;
#pragma clang diagnostic pop
}
The delegate will provide the controller with its animator, interaction controller, and manage the screen edge pan gesture to dismiss the modal presentation.
In Storyboard, drag an Object (yellow cube) from the object library to the modal navigation controller. Set its class to ourNavigationControllerDelegate, and wire up its delegate and navigationController outlets to the storyboard's modal navigation controller.
In prepareForSegue from your search results controller, you'll need to set the modal navigation controller's transitioning delegate and modal presentation style.
navigationController.transitioningDelegate = (id<UIViewControllerTransitioningDelegate>)navigationController.delegate;
navigationController.modalPresentationStyle = UIModalPresentationCustom;
The custom animation that the modal presentation performs is handled by transition animator.
In Xcode, add a new TransitionAnimator file to your project.
TransitionAnimator.h:
#interface TransitionAnimator : NSObject <UIViewControllerAnimatedTransitioning>
#property (nonatomic, assign, getter = isAppearing) BOOL appearing;
TransitionAnimator.m:
#implementation TransitionAnimator
#synthesize appearing = _appearing;
#pragma mark - <UIViewControllerAnimatedTransitioning>
- (NSTimeInterval)transitionDuration:(id<UIViewControllerContextTransitioning>)transitionContext
{
return 0.3;
}
- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext
{
// Custom animation code goes here
}
The animation code is too long to provide within an answer, but it's available in a sample project which I've shared on GitHub.
Having said this, the code, as it stands, was more of a fun exercise. Apple has had years to refine and support all their transitions. If you adopt this custom animation, you may find cases (such as the visible keyboard) where the animation doesn't do what Apple's does. You'll have to decide whether you want to invest the time to improve the code to properly handle those cases.
I know this thread is old, but there seems to be a much simpler approach to getting the desired behavior.
The important thing to realize is the UISearchController is presented from the source controller, which is a view controller inside the navigation controller. If you inspect the view hierarchy, you see that the search controller, unlike regular modal presentations, isn't presented as a direct child of the window, but rather as a subview of the navigation controller.
So the general structure is
UINavigationController
MyRootViewController
UISearchViewController (presented pseudo-"modally")
MyContentController
Essentially you just need to get from the MyContentController up to the MyRootViewController, so you can access its navigationController property. In my tableView:didSelectRowAtIndexPath: method of my search content controller, I simply use the following to access my root view controller.
UINavigationController *navigationController = nil;
if ([self.parentViewController isKindOfClass:[UISearchController class]]) {
navigationController = self.parentViewController.presentingViewController.navigationController;
}
From there you can easily push something onto the navigation controller, and the animation is exactly what you'd expect.
EDIT: an alternate solution that doesn't rely on a UIWindow. I think the effect is very similar to the calendar app.
#interface SearchResultsController () <UINavigationControllerDelegate>
#end
#implementation SearchResultsController
- (void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
// this will be the UINavigationController that provides the push animation.
// its rootViewController is a placeholder that exists so we can actually push and pop
UIViewController* rootVC = [UIViewController new]; // this is the placeholder
rootVC.view.backgroundColor = [UIColor clearColor];
UINavigationController* nc = [[UINavigationController alloc] initWithRootViewController: rootVC];
nc.modalPresentationStyle = UIModalPresentationCustom;
nc.modalTransitionStyle = UIModalTransitionStyleCrossDissolve;
[UIView transitionWithView: self.view.window
duration: 0.25
options: UIViewAnimationOptionTransitionCrossDissolve | UIViewAnimationOptionAllowAnimatedContent
animations: ^{
[self.parentViewController presentViewController: nc animated: NO completion: ^{
UIViewController* resultDetailViewController = [UIViewController alloc];
resultDetailViewController.title = #"Result Detail";
resultDetailViewController.view.backgroundColor = [UIColor whiteColor];
[nc pushViewController: resultDetailViewController animated: YES];
}];
}
completion:^(BOOL finished) {
nc.delegate = self;
}];
}
- (void) navigationController:(UINavigationController *)navigationController willShowViewController:(UIViewController *)viewController animated:(BOOL)animated
{
// pop to root? then dismiss our window.
if ( navigationController.viewControllers[0] == viewController )
{
[UIView transitionWithView: self.view.window
duration: [CATransaction animationDuration]
options: UIViewAnimationOptionTransitionCrossDissolve | UIViewAnimationOptionAllowAnimatedContent
animations: ^{
[self.parentViewController dismissViewControllerAnimated: YES completion: nil];
}
completion: nil];
}
}
#end
ORIGINAL solution:
Here's my solution. I start out using the same technique you discovered in the UICatalog example for showing the search controller:
- (IBAction)search:(id)sender
{
SearchResultsController* searchResultsController = [self.storyboard instantiateViewControllerWithIdentifier: #"SearchResultsViewController"];
self.searchController = [[UISearchController alloc] initWithSearchResultsController:searchResultsController];
self.searchController.hidesNavigationBarDuringPresentation = NO;
[self presentViewController:self.searchController animated:YES completion: nil];
}
In my example, SearchResultsController is a UITableViewController-derived class. When a search result is tapped it creates a new UIWindow with a root UINavigationController and pushes the result-detail view controller to that. It monitors for the UINavigationController popping to root so it can dismiss the special UIWindow.
Now, the UIWindow isn't strictly required. I used it because it helps keep the SearchViewController visible during the push/pop transition. Instead, you could just present the UINavigationController from the UISearchController (and dismiss it from the navigationController:didShowViewController: delegate method). But modally-presented view controllers present on an opaque view by default, hiding what's underneath. You could address this by writing a custom transition that would be applied as the UINavigationController's transitioningDelegate.
#interface SearchResultsController () <UINavigationControllerDelegate>
#end
#implementation SearchResultsController
{
UIWindow* _overlayWindow;
}
- (void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
// this will be the UINavigationController that provides the push animation.
// its rootViewController is a placeholder that exists so we can actually push and pop
UINavigationController* nc = [[UINavigationController alloc] initWithRootViewController: [UIViewController new]];
// the overlay window
_overlayWindow = [[UIWindow alloc] initWithFrame: self.view.window.frame];
_overlayWindow.rootViewController = nc;
_overlayWindow.windowLevel = self.view.window.windowLevel+1; // appear over us
_overlayWindow.backgroundColor = [UIColor clearColor];
[_overlayWindow makeKeyAndVisible];
// get this into the next run loop cycle:
dispatch_async(dispatch_get_main_queue(), ^{
UIViewController* resultDetailViewController = [UIViewController alloc];
resultDetailViewController.title = #"Result Detail";
resultDetailViewController.view.backgroundColor = [UIColor whiteColor];
[nc pushViewController: resultDetailViewController animated: YES];
// start looking for popping-to-root:
nc.delegate = self;
});
}
- (void) navigationController:(UINavigationController *)navigationController didShowViewController:(UIViewController *)viewController animated:(BOOL)animated
{
// pop to root? then dismiss our window.
if ( navigationController.viewControllers[0] == viewController )
{
[_overlayWindow resignKeyWindow];
_overlayWindow = nil;
}
}
#end
As you present a viewController the navigationController becomes unavailable. So you have to dismiss your modal first and then push another viewController.
UISearchController must be rootViewController of a UINavigationController and then you present navigation controller as modal.
This is related to another question of mine, iOS 8 + interactive transition + nav bar shown = broken?, but is different.
On iOS 8, when one is doing an interactive transition from view A to view B via the NavigationControllerDelegate / UIViewControllerInteractiveTransitioning method, and view A has a navbar, and view B does NOT, then what is the correct method to hide / unhide the nav bar?
I tried to do this in the ViewController like this:
- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
[[self transitionCoordinator] animateAlongsideTransition:^(id<UIViewControllerTransitionCoordinatorContext> context) {
if (self.navigationController) {
[self.navigationController setNavigationBarHidden:YES animated:animated];
}
} completion:^(id<UIViewControllerTransitionCoordinatorContext> context) {
NSArray *debugViews = [context containerView].subviews;
NSLog(#"%#", debugViews);
if ([context isCancelled] ) {
if( self.navigationController ) {
[self.navigationController setNavigationBarHidden:NO animated:animated];
}
}
}];
}
- (void)viewWillDisappear:(BOOL)animated {
[[self transitionCoordinator] animateAlongsideTransition:^(id<UIViewControllerTransitionCoordinatorContext> context) {
if (self.navigationController) {
[self.navigationController setNavigationBarHidden:NO animated:animated];
}
} completion:^(id<UIViewControllerTransitionCoordinatorContext> context) {
if ([context isCancelled] ) {
if( self.navigationController ) {
[self.navigationController setNavigationBarHidden:YES animated:animated];
}
}
}];
[super viewWillDisappear:animated];
}
... but there are two big problems:
The view (mainly the navbar) "flickers" sometimes when animation is completing. This is really ugly if you have a complex view underneath.
If the user cancels the interactive transition (ie. by not dragging far enough or pinching enough) then the navbar goes away forever, even though I can see in the code that it's being told to unhide.
Here is some soure-code to show this happening: https://github.com/xaphod/UIViewControllerTransitionTut
--> un-pinch to go from one view controller to another; the first view has a nav bar, the second one does not. When you complete the transition, you can sometimes see flickering (problem 1 above). When you un-pinch just a little bit and let go, that's a cancelled transition: although you're still on view 1, the navbar has disappeared (problem 2 above).
The right way to hide the navigation bar will be to use Navigation's controller delegate,make sure you set the window's navigation controller delegate to self before using the following delegate method:-
Just do this in the AppDelegate.m
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window.rootViewController.navigationController.delegate=self;
//do your rest code...
}
-(void)navigationController:(UINavigationController *)navController
willShowViewController:(UIViewController *)viewController
animated:(BOOL)animated
{
[navController setNavigationBarHidden:([viewController isKindOfClass:[CustomViewController class]])
animated:animated]; // just mention the view controller class type for which you want to hide
}
Referred from this SFO's
If you wants to hide navigation bar in particular viewcontroller you can use this method in wilAppear.
//Unhide
-(void)viewWillAppear:(BOOL)animated
{
self.navigationController.navigationBarHidden = NO;
}
//Hide
-(void)viewWillAppear:(BOOL)animated
{
self.navigationController.navigationBarHidden = YES;
}
I am using a custom Left Menu Controller which can be opened by UIPanGestureRecognizer when the UINavigationController is only at it's Top-Level. If some UIViewController is pushed onto the stack, I want the interactivePopGestureRecognizer to work as expected and pop the VC when user swipes from left-to-right instead of the Left-Menu being opened.
To achieve this, i sub-classed the UINavigationController as follows:
- (void)viewDidLoad {
[super viewDidLoad];
//[self.interactivePopGestureRecognizer setDelegate:nil];
[self.view addGestureRecognizer:[self createPanGestureRecognizer]];
}
- (UIPanGestureRecognizer *) createPanGestureRecognizer {
SGFPanGestureRecognizer * panRecognizer = [[SGFPanGestureRecognizer alloc] initWithTarget:self action:#selector(panGestureRecognized:)];
return panRecognizer;
}
-(void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated {
if(self.viewControllers.count == 1)
if(self.view.gestureRecognizers && self.view.gestureRecognizers.count>0)
for (UIGestureRecognizer * recog in self.view.gestureRecognizers)
{
if([recog isKindOfClass:[SGFPanGestureRecognizer class]]) {
[self.view removeGestureRecognizer:recog];
break;
}
}
[super pushViewController:viewController animated:animated];
}
-(UIViewController *)popViewControllerAnimated:(BOOL)animated {
UIViewController * vc = [super popViewControllerAnimated:animated];
if(self.viewControllers.count == 1)
[self.view addGestureRecognizer:[self createPanGestureRecognizer]];
return vc;
}
Everything is working fine except one: When i am at a detailViewController and I swipe from left, the VC starts the "POP" animation which goes along my finger. If I leave the gesture too quick, the detailViewController doesn't really gets popped and rolls back the popping animation. However, this action fires the popViewControllerAnimated and my logic above becomes useless.
SUMMARY:
So is there a way to understand if the swipe-to-back gesture is released too early to really pop the UINavigationController?
my application story board is as following
it is a tab bar controller based application with one of the tabs embedded in a navigation controller. when the user click on the first tab (view1) and click a button inside this view, he will be moved to view2. instead of using the back button to return to view1, I want the user to click on the tab item in order to return to view1 which works fine. However, I want to view an alert when the user clicks on the tab and he is in View2. I am using shouldSelectViewController and didSelectViewController delegate methods to check what tab is clicked and view the alert. The problem is that I can't reach View2 from these methods in the delegate to inform the application to view the alert only when user is in view2 and clicks the tab.
I tried to use this code inside shouldSelectViewController
if (tabBarController.selectedIndex == 0) {
NSLog(#"Delegate nav title: %#", tabBarController.selectedViewController.navigationItem.title);
}
these lines always return the title of view1
As they are in the same navigation controller, they have the same navigation item. Each view can configure this navigation item but it is generally the same object. That is why it returns the same title. Try setting up the navigation item title in second view controller's viewDidLoad method.
I finally found a solutino to my problem
first I added a static variable to View2 and called it inView2 as following
in View2.h
#interface
{}
+ ( BOOL ) isInQuizViewController;
+ ( void )setInQuizViewController:(BOOL)inQuizVal;
//...
#end
in View2.m
#implementation
static BOOL inView2 = NO;
+(BOOL)isInView2
{
return inView2;
}
+ ( void )setInView2:(BOOL)Val
{
inView2 = val;
}
these two methods are for setting and getting the value of inView2 which tells me whether or not the user is currently in View2
in View1.h create an IBAction associated with the button that will transmit from View1 to View2 and connect it to your storyboard
- (IBAction)GoToView2:(id)sender;
go to View1.m and import
#import "View2.h"
and implement your IBAction method to set the InView2 to YES
- (IBAction)GoToView2:(id)sender {
[View2 setInView2:YES];
}
then in the delegate.m
#import "View2.h"
#implementation AppDelegate
UITabBarController * _tabBarController;
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
_tabBarController = (UITabBarController *)_window.rootViewController;
_tabBarController.delegate = self;
// Override point for customization after application launch.
return YES;
}
I defined a global _tabBarController and set it to _window.rootViewController and set its delegate to this delegate and remember to import "View2.h"
going to the ShouldSelectViewController method (note that this method is called before the transition to the selected tab ViewController, hence it is perfect for decision making of whether or not the selected tab viewController should be displayed to the user).
so in ShouldSelectViewController method I did the following
- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {
if(tabBarController.selectedIndex == 2)
{
if ([View2 isInView2]) {
UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:#"alert"
message:#"are you sure you want to exit?"
delegate:self
cancelButtonTitle:#"Cancel"
otherButtonTitles:#"Yes",nil];
[alertView show];
return NO;
}
}
return YES;
}
-(void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex
{
if(buttonIndex == 1)
{//ok button pressed
// NSInteger destinationTabIdx = 2;
// UIView * fromView = tabBarController.selectedViewController.view;
// UIView * toView = [[[[[tabBarController.viewControllers objectAtIndex:destinationTabIdx] navigationController] viewControllers] objectAtIndex:0] view];
UINavigationController *nav = (UINavigationController *)_tabBarController.selectedViewController;
NSLog(#"vc title: %#",nav.title);
// [UIView transitionFromView:fromView toView:toView duration:0.8
// options: UIViewAnimationOptionTransitionNone
// completion:^(BOOL finished) {
// if (finished) {
// tabBarController.selectedIndex = destinationTabIdx;
// }
// }];
[nav popViewControllerAnimated:YES];
[QuizViewController setInQuizViewController:NO];
NSLog(#"app delegate transistion done");
}
}