How to make UIToolbar's background transparent? [duplicate]

Question

I want to make my UIToolBar have a transparent background (similar to iBooks) but I'm having no luck with setting the translucent property.

Here's my code:

UIToolbar *toolBar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
    NSMutableArray *toolBarItems = [[NSMutableArray alloc] init];
    [toolBarItems addObject:[[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStyleBordered target:nil action:nil]];
    [toolBarItems addObject:[[UIBarButtonItem alloc] initWithTitle:@"Source" style:UIBarButtonItemStyleBordered target:nil action:nil]];
    [toolBarItems addObject:[[UIBarButtonItem alloc] initWithTitle:@"Aa" style:UIBarButtonItemStyleBordered target:nil action:nil]];
    [toolBarItems addObject:[[UIBarButtonItem alloc] initWithTitle:@"Rabbit" style:UIBarButtonItemStyleBordered target:nil action:nil]];
    toolBar.items = toolBarItems;
    toolBar.translucent = YES;
    [self.view addSubview:toolBar];

It still comes out like this:

Cymoid

I believe you will need to set a transparent background image in order to do this. Just create a 1x1 pixel transparent png. – Elyot

@doug Smithh as uitoolbar is a subclass of uiview you can use it's layer property to make it transparent by changing the value of alpha – Charlot

Have a look at: #2469331 – Internationalist

Answer 1

If you want toolbar as Transparent :

[toolBar setBackgroundImage:[[UIImage alloc] init] forToolbarPosition:UIToolbarPositionAny barMetrics:UIBarMetricsDefault];

and if you want toolbar as Translucent :

[toolBar setBarStyle:UIBarStyleBlack];
toolBar.translucent = YES;

Hope it helps you.

Susian

Could you explain the method you used for transparent? – Cymoid

The Transparent method still show a thin bar at the top of the toolbar border, how to get rid of that? – Armet

Nice elegant solution for iOS 7 – Bung

It seems that in iOS 7 you have to have all three lines of code in order to get transparency. If I set translucent = NO, there seems to be no way to get transparency in the toolbar at all – Abohm

@Malloc: [toolbar setShadowImage:[UIImage new]forToolbarPosition:UIToolbarPositionAny]; – Arabela

Thanks, good solution! Trannslucent in storyboard en the first line in code fixed it. – Aristocracy

Answer 2

One option is to subclass UIToolbar and override the draw method, the buttons will continue to draw themselves as normal:

@interface TransparentToolbar : UIToolbar 
{
}

@implementation TransparentToolbar

// drawRect stub, toolbar items will still draw themselves
- (void)drawRect:(CGRect)rect
{
    return;
}

@end

Lamia