UIToolBar background transparent

Question

I am trying to place UIToolBar in UINavigationBar.

   UIToolbar* tempFontSizeToolBar = [[UIToolbar alloc] initWithFrame:CGRectMake(kPaginationToolBarOriginX,kPaginationToolBarOriginY,kPaginationToolBarWidth,kPaginationToolBarHeight)];

    tempFontSizeToolBar.backgroundColor = [UIColor clearColor];

  // create the array to hold the buttons, which then gets added to the toolbar

   NSMutableArray* buttons = [[NSMutableArray alloc] init];
  [tempFontSizeToolBar setTranslucent:YES];
  UIBarButtonItem *fontSizeBarButtonItem;

  fontSizeBarButtonItem = [[UIBarButtonItem alloc]
                         initWithImage:[UIImage imageNamed:KpreviousPageIcon] style:UIBarButtonItemStylePlain target:self action:@selector(movePreviousPage:)];

  [buttons addObject:fontSizeBarButtonItem];

  [fontSizeBarButtonItem release];fontSizeBarButtonItem = nil;

  fontSizeBarButtonItem = [[UIBarButtonItem alloc]
                         initWithImage:[UIImage imageNamed:KnextpageIcon] style:UIBarButtonItemStylePlain  target:self action:@selector(moveNextPage:)];

  [buttons addObject:fontSizeBarButtonItem];

  [fontSizeBarButtonItem release];fontSizeBarButtonItem = nil;

// stick the buttons in the toolbar
  [tempFontSizeToolBar setItems:buttons animated:NO];

  [buttons release];buttons = nil;

  UIBarButtonItem *rightBarItem = [[UIBarButtonItem alloc] initWithCustomView:tempFontSizeToolBar];

  self.navigationItem.rightBarButtonItem = rightBarItem;

The background color of that UIToolBar is the default Blue. But I need the Toolbar should be in clear color so that the NavigationBar's background image should appear in that Toolbar also.

Pls suggest me.

score 5 · Answer 1 · answered Dec 13 '12 at 05:53

5

To make a toolbar transparent, use the following:

const float colorMask[6] = {222, 255, 222, 255, 222, 255};
UIImage *img = [[UIImage alloc] init];
UIImage *maskedImage = [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];

[self.toolbar setBackgroundImage:maskedImage forToolbarPosition:UIToolbarPositionAny barMetrics:UIBarMetricsDefault];

answered Dec 13 '12 at 05:53

jd.

4,057
7
37
45

This simulates the correct behavior for a different issue that I encountered in iOS 6. [The thread I started on the subject is here.](http://stackoverflow.com/questions/16618410/uitoolbar-buttons-with-uiimage-not-entirely-transparent) – Chris Ostmo May 17 '13 at 22:35

QED · Accepted Answer · 2012-02-22T06:54:24.803

3

Not sure what you're after here, but your code is messy, and I think you can get what you want without so much effort. Anyway, a button item should not have a toolbar as its custom view.

If your goal is to have a 'prev' button on the left and a 'next' button on the right of a UINavigationBar, then you can just set them as the UINavigationItem's leftBarButtonItem and rightBarButtonItem. No array necessary.

If your goal is to have 'prev' and 'next' adjacent to each other and on the right side of the UINavigationBar, then put them ('next' first) in an array and then use UINavigationItem's setRightBarButtonItems:animated:.

In neither case is a UIToolbar necessary. You can couple a UIToolbar with a UINavigationController as per Apple's docs here. It pops up at the bottom of the screen, perhaps not what you want, but you can set its tint or background image. If you must have the toolbar at top, you can create one and place it there manually, not too hard.

Good luck!

edited Feb 22 '12 at 06:54

answered Feb 22 '12 at 06:47

QED

9,803
7
50
87

I am placing toolbar on the top of navigation bar only. What I want is the toolbar should be transparent so that the buttons in the toolbar appears like its placed in navigation bar directly. – Bharathi Feb 22 '12 at 07:48
I have already tried those methods. setRightBarButtonItems:animated: is supported only ios 5 .its crashing when run it on version 4. – Bharathi Feb 22 '12 at 07:55
So what you're trying to do is mimic `setRightBarButtonItems:animated:` in iOS < 5? – QED Feb 22 '12 at 16:08

score 2 · Answer 3 · answered Jul 10 '13 at 13:40

2

set toolbarStyle -1 like this

 tools.barStyle = -1; // clear background

answered Jul 10 '13 at 13:40

NANNAV

4,875
4
32
50

This almost works for a UIToolbar on top of a MKMapView as the root view of a UIViewController. The remaining issue is that the toolbar's hairline is still drawn. Here's the fix: http://stackoverflow.com/questions/19110883/remove-uitoolbar-hairline-in-ios-7 – Jul 28 '15 at 23:38

UIToolBar background transparent

3 Answers3

Linked