Change the height of NavigationBar and UIBarButton

问题:

I suppose it's not strictly in line with Apple guidelines but I guess it must be possible somehow. I'd like to change the height of navigation bar inside UINavigationController and the height of UIBarButtonItem elements inside that bar.

Using a trick from this question I managed to change the height of navigation bar but I can see no way of adjusting the height of bar button items.

If anyone knows how to change the size of bar button items, please help me out.

回答1:

Maybe this tutorial about a customized navbar will help you: Recreating the iBooks wood themed navigation bar

If you create a BarButtonItem with a UIImageView you can maybe change the framesize/boundsize of the custom UIImageView

UIImageView* imageView = [[[UIImageView alloc] initWithFrame:navigationController.navigationBar.frame] autorelease];
imageView.contentMode = UIViewContentModeLeft;
imageView.image = [UIImage imageNamed:@"NavBar-iPhone.png"];
[navigationController.navigationBar insertSubview:imageView atIndex:0];

So for your need you would give the -initWithFrame method appropriate values.

回答2:

This is my solution. It works very well.

@interface UINavigationBar (CustomHeight)

@end

@implementation UINavigationBar (CustomHeight)

- (CGSize)sizeThatFits:(CGSize)size {
    // Change navigation bar height. The height must be even, otherwise there will be a white line above the navigation bar.
    CGSize newSize = CGSizeMake(self.frame.size.width, 40);
    return newSize;
}

-(void)layoutSubviews {
    [super layoutSubviews];

    // Make items on navigation bar vertically centered.
    int i = 0;
    for (UIView *view in self.subviews) {
        NSLog(@"%i. %@", i, [view description]);
        i++;
        if (i == 0)
            continue;
        float centerY = self.bounds.size.height / 2.0f;
        CGPoint center = view.center;
        center.y = centerY;
        view.center = center;
    }
}

回答3:

static CGFloat const CustomNavigationBarHeight = 74;


@implementation WTNavigationBar



- (CGSize)sizeThatFits:(CGSize)size{
    size.width = 1024;
    size.height = CustomNavigationBarHeight;
    return size;
}

-(void)layoutSubviews {
    [super layoutSubviews];
    for (UIView *view in self.subviews) {
        SFLog(@"view.class=%@",[view class]);
        if ([view isKindOfClass:NSClassFromString(@"UINavigationItemButtonView")]) {
            float centerY = self.bounds.size.height / 2.0f;
            CGPoint center = view.center;
            center.y = centerY;
            view.center = center;
        }
    }
}


@end

in my iPad app,which has a fixed landscape orientation,I found I have to hardcode the size's width

回答4:

I managed to do something similar by subclassing UINavigationBar and overriding -layoutSubviews. The code looks like:

-(void)layoutSubviews {
    [super layoutSubviews];
    int i = 0;
    for (UIView *view in self.subviews) {
        NSLog(@"%i. %@", i++, [view description]);
        if ([view isKindOfClass:NSClassFromString(@"UINavigationButton")]) {
            view.frame = CGRectMake(0, 0, 100, 50);
        }
    }
}

If you need to know how to subclass UINavigationBar, have a look at this very good answer.

I am not really sure about the NSClassFromString(@"UINavigationButton")] part. It works, but I did this as an experiment, and I'm not sure if this will get approved by Apple. I hope someone with a better knowledge might shed some light.

回答5:

For the UINavigationbar

In iOS SDK 4.3 and beyond, there is a way (hack) to change the height of the UINavigationBar.

To change the height of UINavigationController, change its frame size in viewWillAppear:animated: function. Then, the height will stay customized throughout whole app.

For the UIBarButtonItems
I've actually run into this myself and the only thing I could come up with was leveraging initWithCustomView and passing in a UIButton with a defined frame.

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];

/*
* Insert button styling
*/

button.frame = CGRectMake(0, 0, width, height);

UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];

Otherwise UIBarButtonItem only has a width property that can be set but unfortunately not a height property. Another nifty thing I've done with initWithCustomView is to pass in a toolbar with a button and other things like activity indicators. Hope this helps.

回答6:

How badly do you want this? And, how thin (or thick) do you want to make your navbar?

One approach would be to set the transform of the navbar to scale and translate it. If you scale it too much the title and button text will look wonky, but if you only need to shave a few pixels you might be allright.

Here's the result of scaling it to be 75% of full height (33 pixels tall):

And the code that produced this:

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.navigationItem.title = @"Thin Navigation Bar";

    self.navigationItem.rightBarButtonItem = [[[UIBarButtonItem alloc] initWithTitle: @"Press Me" style:UIBarButtonItemStyleBordered target: nil action: NULL ] autorelease];

    CGFloat scale = .75;
    CGFloat cy = 44.0 - ( 44.0 * scale );

    self.navigationController.navigationBar.transform = CGAffineTransformScale( CGAffineTransformMakeTranslation( 0, -cy / 2.0 ), 1.0, scale )  ;
}

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];

    CGFloat scale = .75;
    CGFloat cy = 44.0 - ( 44.0 * scale );

    CGRect r = self.view.frame;
    r.origin.y -= cy;
    r.size.height += cy;
    self.view.frame = r;
}

Now, this does have a number of problems, which may or may not be solvable. #1 is that you're fighting with the UINavigationController to size and position the navbar and the view-controller views. Animating between view controllers that use this technique is likely going to look weird.

I'd be curious if you could solve the related issues...

One last thought: If you dont use a UINavigationController then there really aren't a whole lot of issues with this other than squished text. Or, you could use a navigation controller but hide the default navbar, and add the thin navbar to each of your child-view controller views. You could even subclass UINavigationBar and set the transform from within:

@interface TSThinNavBar : UINavigationBar
{
}
@end

@implementation TSThinNavBar

// assuming we'll always be constructed from a nib
- (id) initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder: aDecoder];
    if ( self != nil ) 
    {
        CGFloat scale = .75;
        CGFloat cy = 44.0 - ( 44.0 * scale );

        self.transform = CGAffineTransformScale( CGAffineTransformMakeTranslation( 0, -cy / 2.0 ), 1.0, scale )  ;
    }

    return self;
}

@end