Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS: Positioning navigation bar buttons within custom navigation bar

I'm building an app with a custom navigation bar. After some research I decided to do this using a category on UINavigationBar. The navigation bar needs to be a bit larger than usual to accomodate a drop shadow. Here is the code:

#import "UINavigationBar+CustomWithShadow.h"

@implementation UINavigationBar (CustomWithShadow)

- (void)drawRect:(CGRect)rect {

    // Change the tint color in order to change color of buttons
    UIColor *color = [UIColor colorWithHue:0.0 saturation:0.0 brightness:0.0 alpha:0.0];
    self.tintColor = color;

    // Add a custom background image to the navigation bar 
    UIImage *image = [UIImage imageNamed:@"NavBar.png"];
    [image drawInRect:CGRectMake(0, 0, self.frame.size.width, 60)];
}

- (void)layoutSubviews {

    self.frame = CGRectMake(0, 20, self.frame.size.width, 60);
}
@end

The only problem now is that the larger navigation bar means that the navigation bar buttons end up too far down, like so:

enter image description here

Does anyone know how I can correct the position of the buttons?

Thanks for all help!

Update:

I add the buttons to the nav bar in the init method of the view controller like so:

// Create "Add" button for the nav bar
UIBarButtonItem *addButton = [[UIBarButtonItem alloc] 
    initWithBarButtonSystemItem:UIBarButtonSystemItemAdd 
    target:self 
    action:@selector(createNewEntry:)];
[[self navigationItem] setRightBarButtonItem:addButton];
[addButton release];
like image 579
Erik Frisk Avatar asked May 29 '11 18:05

Erik Frisk


People also ask

How do I customize the navigation bar on my iOS app?

Create custom titles, prompts, and buttons in your app’s navigation bar. Use UINavigationBar to display your app’s navigational controls in a bar along the top of the iOS device’s screen.

How do I customize the right side of the navigation bar?

The right side of the navigation bar options for customization include applying a custom UIView or using a UIBarButtonItem. The sample demonstrates placing three kinds of UIBarButtonItems on the right side of the navigation bar: a button with a title, a button with an image, and a button with a UISegmentedControl.

How do I display my app’s navigational controls?

Use UINavigationBar to display your app’s navigational controls in a bar along the top of the iOS device’s screen. You can also design a distinctive navigation bar that matches your app’s design and creates intuitive interaction for your users.

How do I add a navigation bar to a view controller?

Select the View Controller and in The Editor menu select Embed in -> Navigation Controller. Next, drag a Bar Button from the Object Library to the left side of the Navigation Bar and name it "Left Item". Repeat this for the right side and name it "Right Item".


1 Answers

You'll need to add the leftBarButtonItem and rightBarButtonItem as custom items and mess with the frames.... for example:

UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0,5,buttonImage.size.width,buttonImage.size.height)];
[button setBackgroundImage:buttonImage forState:UIControlStateNormal];
[button addTarget:delegate action:@selector(barButtonPressed:) forControlEvents:UIControlEventTouchUpInside];
[button setTitle:titleString forState:UIControlStateNormal];
[button setTitleColor:CUSTOM_BAR_BUTTON_TITLE_COLOR forState:UIControlStateNormal];
[[button titleLabel] setFont:[UIFont boldSystemFontOfSize:14]];
[[button titleLabel] setShadowColor:CUSTOM_BAR_BUTTON_SHADOW_COLOR];
[[button titleLabel] setShadowOffset:CGSizeMake(0,-1)];

UIBarButtonItem *barButton = [[UIBarButtonItem alloc] initWithCustomView:button];
[button release];

[[self navigationItem] setRightBarButtonItem:barButton];
[barButton release];
like image 91
adam Avatar answered Oct 12 '22 21:10

adam