iOS transition with extended navigation bar

Question

I am using an extended navigation bar for my application, increasing its height by 30 points. To do that, I have subclassed UINavigationBar, here is my CustomNavigationBar.m :

CGFloat CustomNavigationBarHeightIncrease = 30.f;

@implementation CustomNavigationBar

- (CGSize)sizeThatFits:(CGSize)size {

  CGSize amendedSize = [super sizeThatFits:size];
  amendedSize.height += CustomNavigationBarHeightIncrease;

  return amendedSize;
}

- (id)initWithCoder:(NSCoder *)aDecoder {

  self = [super initWithCoder:aDecoder];

  if (self) {
    [self initialize];
  }

  return self;
}

- (id)initWithFrame:(CGRect)frame {

  self = [super initWithFrame:frame];

  if (self) {
      [self initialize];
  }

  return self;
}

- (void)initialize {

  [self setTransform:CGAffineTransformMakeTranslation(0, -(CustomNavigationBarHeightIncrease))];
}

- (void)layoutSubviews {
  [super layoutSubviews];

  NSArray *classNamesToReposition = @[@"_UINavigationBarBackground"];

  for (UIView *view in [self subviews]) {

      if ([classNamesToReposition containsObject:NSStringFromClass([view class])]) {

          CGRect bounds = [self bounds];
          CGRect frame = [view frame];
          frame.origin.y = bounds.origin.y + CustomNavigationBarHeightIncrease - 20.f;
          frame.size.height = bounds.size.height + 20.f;

          [view setFrame:frame];
      }
  }
}

@end

Then, in the viewDidLoad of a view controller, I set up the titleView property of my navigation item like this:

self.navigationItem.title = @"";
UIImage* logoImage = [UIImage imageNamed:@"welcome"];
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:logoImage];
self.navigationItem.titleView.contentMode = UIViewContentModeScaleAspectFill;
self.navigationItem.titleView.contentMode = UIViewContentModeBottom;

and the frame of my titleView has a height of 80 points.

Everything works fine until then, but I have an issue when I change view controller (the image used changes between view controllers). As soon as the animation starts, the bottom of my image (and just my image in the titleView, not the whole navigation bar) gets cropped by my extra height, the transition takes place correctly (well, only with the remaining bit), and as soon as it is finished, the cropped bit of the new image appears.

I hope it is clear, it seems like I can't get any animation on the extra bit of navigation bar that I have added.

Thanks for your help, I really don't know where to start with this.

Answer 1

Instead of subclassing the UINavigationBar try customizing it. It will require you to set the constraints in Interface Builder to offset Navigation Bar sizing, but it's not too difficult:

#pragma mark - Navigation Bar Setup

- (void)setupNavBar
{
    [self.navigationController setNavigationBarHidden:NO animated:YES];

    self.navigationController.navigationBar.barStyle = UIBarStyleBlackTranslucent;
    self.navigationController.navigationBar.barTintColor = [UIColor blackColor];

    [self.navigationController.navigationBar setBounds:CGRectMake(0, 0, self.view.frame.size.width, 80)];

// Customizing the back button in the Nav Bar

    self.navigationItem.hidesBackButton = YES;

    UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
    backButton.frame = CGRectMake(0, 0, 30, 30);
    [backButton setImage:[UIImage imageNamed:@"backbtn"] forState:UIControlStateNormal];
    [backButton addTarget:self action:@selector(backButtonPressed) forControlEvents:UIControlEventTouchUpInside];

    UIBarButtonItem *leftButton = [[UIBarButtonItem alloc] initWithCustomView:backButton];
    self.navigationItem.leftBarButtonItem = leftButton;

    UIImage *title = [UIImage imageNamed:@"title_image"];
    UIImageView *titleImgView = [[UIImageView alloc] initWithImage:title];
    titleImgView.frame = CGRectMake(10, 15, 85, 24);

    UIView *titleView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 105, 50)];
    [titleView addSubview:titleImgView];

    self.navigationItem.titleView = titleView;
}

Sample method to call the back button:

- (void)backButtonPressed
{
    for (UIViewController *vc in self.childViewControllers)
    {
        if ([vc isEqual:[PinningVC class]])
        {
            [vc removeFromParentViewController];
        }
    }

    [self.navigationController popViewControllerAnimated:NO];
}