带有扩展导航栏的 iOS 过渡

Question

我正在为我的应用程序使用扩展导航栏，将其高度增加 30 点。 为此，我对 UINavigationBar 进行了子类化，这是我的 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

然后，在 View Controller 的 viewDidLoad 中，我像这样设置导航项的 titleView 属性:

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;

我的 titleView 的框架高度为 80 点。

在那之前一切正常，但是当我更改 View Controller 时遇到问题(使用的图像在 View Controller 之间发生变化)。一旦动画开始，我的图像底部(只是我在 titleView 中的图像，而不是整个导航栏)就会被我的额外高度裁剪，过渡正确发生(好吧，只有剩下的一点)，并且一旦完成，就会出现新图像的裁剪部分。

我希望它很清楚，似乎我无法在我添加的额外导航栏上获得任何动画。

谢谢你的帮助，我真的不知道从哪里开始。

Answer 1

与其对 UINavigationBar 进行子类化，不如尝试自定义它。它将要求您在 Interface Builder 中设置约束以抵消导航栏的大小调整，但这并不难:

#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;
}

调用后退按钮的示例方法:

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

    [self.navigationController popViewControllerAnimated:NO];
}