Question

I’m adding a couple of buttons to an already-existing NavigationController. The two buttons are added to a UIView, which is pushed onto the NavigationItem. The buttons stop and reload a UIWebView.

Problem is that there’s a slight offset issue that is making it all look pretty ugly. I wish I could set the UIToolbar to transparent or clear background but that doesn’t seem to be an option. Can’t seem to use negative offsets either. I’ve got color matching, but if you look closely there’s 1px or 2px of highlighting up top that’s causing a visual mismatch and then a slight offset at the bottom.

Some relevant code below (based on this, inbound Googlers). What are my options to resolve this?

    // create a toolbar for the buttons
 UIToolbar* toolbar = [[UIToolbar alloc]
        initWithFrame:CGRectMake(0, 0, 100, 45)];
 [toolbar setBarStyle: UIBarStyleDefault]; 
 UIColor *colorForBar = [[UIColor alloc] initWithRed:.72 green:0 blue:0 alpha:0];
 toolbar.tintColor = colorForBar;
    [colorForBar release];

 //[toolbar setTranslucent:YES];

 // create an array for the buttons
 NSMutableArray* buttons = [[NSMutableArray alloc] initWithCapacity:3];

 // create a standard reload button
 UIBarButtonItem *reloadButton = [[UIBarButtonItem alloc]
           initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh
           target:self
           action:@selector(reload)];
 reloadButton.style = UIBarButtonItemStyleBordered;
 [buttons addObject:reloadButton];
 [reloadButton release];

 // create a spacer between the buttons
 UIBarButtonItem *spacer = [[UIBarButtonItem alloc]
          initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
          target:nil
          action:nil];
 [buttons addObject:spacer];
 [spacer release];

 // create a standard delete button with the trash icon
 UIBarButtonItem *stopButton = [[UIBarButtonItem alloc]
          initWithBarButtonSystemItem:UIBarButtonSystemItemStop
          target:self
          action:@selector(stopLoading)];
 stopButton.style = UIBarButtonItemStyleBordered;
 [buttons addObject:stopButton];
 [stopButton release];

 // put the buttons in the toolbar and release them
 [toolbar setItems:buttons animated:NO];
 [buttons release];

 // place the toolbar into the navigation bar
 self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]
             initWithCustomView:toolbar];
 [toolbar release];

Update: Alignment was fixed by suggestion by @Jacob below. Now, how to solve the highlighting mismatch?

Answer 1

I’ve had this same exact issue before, and after some hacking around, I figured this out:

You need to set the height of the UIToolbar‘s frame to 44.01 for this to work.

EDIT: Re: highlighting mismatch -> You can try setting the backgroundColor to the colorForBar.

 UIToolbar* toolbar = [[UIToolbar alloc]
                          initWithFrame:CGRectMake(0, 0, 100, 44.01)];
 UIColor *colorForBar = [[UIColor alloc] initWithRed:.72 green:0 blue:0 alpha:0];
 toolbar.tintColor = colorForBar;
 toolbar.backgroundColor = colorForBar;