UINavBar seems to have an invisible layer over other buttons

Question

I created an application with a side menu like facebooks. I have a root view controller which adds a view over itself, then when the user presses the 'Menu' button it will slide the view over so you can see the menu.

My issue is that when the view first loads it looks like the UINavBar is about 20 pixels or so lower than it should be. (The below image looks a bit off centered because it is a modal horizontal flip)

It then automatically adjusts itself and moves up just under that status bar when the modal transition is complete.

Here is a screenshot of what happens when I press the "Menu" button. It slides the top view over to the right

As you can see in the images above I have the left arrow and right arrow frame background set to red so that I can see where the clickable / tappable region is. I have another image which I drew a blue line on that shows if I click the blue line or above then it will not trigger the right arrow. If I click in that same general area on the left side the menu button will trigger. I am able to reproduce this in both the simulator and on a mobile device (so I am not fat fingering the button).

It seems to me that since the navigation bar is loading lower than it is supposed to the iPhone thinks it is still in that position so when I click inside the UIButton frame it is still triggering the Menu and not triggering the arrow selectors. If I tap DIRECTLY in the middle of the arrows, it triggers the arrows selectors but just a tiny bit outside the image, it will not trigger the arrow selector.

Here is my RootViewController viewDidLoad

AppointmentViewController *appointmentViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"AppointmentViewController"];
NSLog(@"B: %@",NSStringFromCGRect(appointmentViewController.view.frame));
self.navController = [[UINavigationController alloc] initWithRootViewController:appointmentViewController];
NSLog(@"B2: %@",NSStringFromCGRect(appointmentViewController.view.frame));
NSLog(@"Nav Bounds: %@",NSStringFromCGRect(self.navController.view.frame));
NSLog(@"Bounds: %@",NSStringFromCGRect(self.contentView.bounds));
self.navController.view.frame = self.contentView.bounds;
NSLog(@"Nav Bounds2: %@",NSStringFromCGRect(self.navController.view.frame));
[self addShadowToMenu];
[self.contentView addSubview:self.navController.view];

RootViewController Logs

2012-04-30 12:24:44.533 My-App[19929:fb03] B: {{0, 20}, {320, 460}}
2012-04-30 12:24:44.535 My-App[19929:fb03] B2: {{0, 20}, {320, 460}}
2012-04-30 12:24:44.535 My-App[19929:fb03] Nav Bounds: {{0, 0}, {320, 480}}
2012-04-30 12:24:44.535 My-App[19929:fb03] Bounds: {{0, 0}, {320, 460}}
2012-04-30 12:24:44.535 My-App[19929:fb03] Nav Bounds2: {{0, 0}, {320, 460}}

AppointmentViewController

self.title = [dataObj.preferences objectForKey:@"appts_name_plural"];
self.navigationItem.title = self.title;
dayView = [[APCalendarDayView alloc] initWithCalendarView:(APCalendarView *)self];
APListView = [self.storyboard instantiateViewControllerWithIdentifier:@"AppointmentListView"];
APListView.tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];


SideMenuView *myDelegate = [[SideMenuView alloc] init];
[self setSideMenuDelegate:myDelegate];
//set the delegate's currentViewController property so that we can add a subview to this View. 
[sideMenuDelegate setCurrentViewController:self];

UIBarButtonItem *flexSpace = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
UIBarButtonItem *today = [[UIBarButtonItem alloc] initWithTitle:@"Today" style:UIBarButtonItemStyleBordered target:nil action:@selector(todayPressed)];
NSArray *appointmentNavigationItems = [[NSArray alloc] initWithObjects:@"Day",@"List",@"Month", nil];
navcontrol = [[UISegmentedControl alloc] initWithItems:appointmentNavigationItems];
[navcontrol setSegmentedControlStyle:UISegmentedControlStyleBar];
[navcontrol addTarget:self action:@selector(appointmentNavigationClicked:) forControlEvents:UIControlEventValueChanged];
[navcontrol setSelectedSegmentIndex:0];
UIBarButtonItem *segmentItems = [[UIBarButtonItem alloc] initWithCustomView:navcontrol];

NSArray *items = [NSArray arrayWithObjects:today,flexSpace,segmentItems, flexSpace, nil];
[appointmentToolbar setItems:items animated:NO];
[appointmentToolbar setAutoresizesSubviews:YES];


[[self.view superview] addSubview:myDelegate.view];
[self setViewSizeOffset:(appointmentToolbar.bounds.size.height)];

CalendarDayView

- (void)addSubviewsToHeaderView:(UIView *)headerView
{
    const CGFloat kChangeMonthButtonWidth = 46.0f;
    const CGFloat kChangeMonthButtonHeight = 44.0f;
    const CGFloat kMonthLabelWidth = 215.0f;
    const CGFloat kHeaderVerticalAdjust = 7.f;

    // Header background gradient
    UIImageView *backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Kal.bundle/kal_grid_background.png"]];
    CGRect imageFrame = headerView.frame;
    imageFrame.origin = CGPointZero;
    backgroundView.frame = imageFrame;
    [headerView addSubview:backgroundView];
    [backgroundView setAutoresizesSubviews:YES];
    [backgroundView setAutoresizingMask:UIViewAutoresizingFlexibleWidth];

    // Create the previous month button on the left side of the view
    CGRect previousMonthButtonFrame = CGRectMake(self.left, 0, kChangeMonthButtonWidth, kChangeMonthButtonHeight);
    UIButton *previousMonthButton = [[UIButton alloc] initWithFrame:previousMonthButtonFrame];
    [previousMonthButton setBackgroundColor:[UIColor redColor]];
    [previousMonthButton setImage:[UIImage imageNamed:@"Kal.bundle/kal_left_arrow.png"] forState:UIControlStateNormal];
    previousMonthButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
    previousMonthButton.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
    [previousMonthButton addTarget:self action:@selector(showPreviousDay) forControlEvents:UIControlEventTouchUpInside];
    //[previousMonthButton setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin];
    [headerView addSubview:previousMonthButton];

    // Draw the selected month name centered and at the top of the view
    CGRect monthLabelFrame = CGRectMake((self.frame.size.width/2.0f) - (kMonthLabelWidth/2.0f), kHeaderVerticalAdjust, kMonthLabelWidth, kMonthLabelHeight);
    headerTitleLabel = [[UILabel alloc] initWithFrame:monthLabelFrame];
    headerTitleLabel.backgroundColor = [UIColor clearColor];
    headerTitleLabel.font = [UIFont boldSystemFontOfSize:22.f];
    headerTitleLabel.textAlignment = UITextAlignmentCenter;
    headerTitleLabel.textColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"Kal.bundle/kal_header_text_fill.png"]];
    headerTitleLabel.shadowColor = [UIColor whiteColor];
    headerTitleLabel.shadowOffset = CGSizeMake(0.f, 1.f);
    //[self setHeaderTitleText:[logic selectedMonthNameAndYear]];

    NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
    [dateFormatter setDateFormat:@"E, MMM dd, yyyy"];   
    headerTitleLabel.text = [dateFormatter stringFromDate:dataObj.activeDate];
    [headerView addSubview:headerTitleLabel];

    // Create the next month button on the right side of the view
    CGRect nextMonthButtonFrame = CGRectMake(self.frame.size.width - kChangeMonthButtonWidth, 0, kChangeMonthButtonWidth, kChangeMonthButtonHeight);
    UIButton *nextMonthButton = [[UIButton alloc] initWithFrame:nextMonthButtonFrame];
    nextMonthButton.frame = nextMonthButtonFrame;
    [nextMonthButton setImage:[UIImage imageNamed:@"Kal.bundle/kal_right_arrow.png"] forState:UIControlStateNormal];
    [nextMonthButton setBackgroundColor:[UIColor redColor]];
    nextMonthButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
    nextMonthButton.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
    [nextMonthButton addTarget:self action:@selector(showFollowingDay) forControlEvents:UIControlEventTouchUpInside];
    //[nextMonthButton setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
    [headerView addSubview:nextMonthButton];
}

UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0.f, 0.f, self.frame.size.width, kHeaderHeight)];
    headerView.backgroundColor = [UIColor grayColor];
    [self addSubviewsToHeaderView:headerView];
    [headerView setAutoresizesSubviews:YES];
    [headerView setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight];
    [self addSubview:headerView];
    [self bringSubviewToFront:headerView];

If I move the headerView down farther it will allow me to select anywhere in the red area and have the arrow selector be triggered. However, I want it to match Apples calendar and be just under the navigation bar.

Anyone know why the navigation bar is blocking the top portion of the headerView from being tapped? To be clear the portion of the headerView that is being blocked is from the bottom of the blue line and up. The UIButton with the red background has an action tied to the frame so it should be triggering the event, however it appears the navbar is blocking half of the UIButton from receiving taps.

Answer 1

This behavior is due to the fact that UIWindow is not propagating touches that coincide with the nav bar frame. The only way to override this behavior is to subclass UIWindow and override the hitTest: method. This will allow you to detect touches in this area, and forward them to the appropriate responders.

Here is an example project showing a custom UIWindow subclass that will respond to touches any where on the screen.