web-dev-qa-db-fra.com

Comment dessiner une barre UIToolbar ou UINavigationBar transparente dans iOS7

Je voudrais un UIToolbar et/ou UINavigationBar entièrement transparent. J'ai essayé les différentes incantations suggérées pour les versions antérieures et postérieures à iOS 5, mais aucune ne semble plus fonctionner.

Comment cela pourrait-il être accompli dans iOS 7?

iosuinavigationcontrolleruinavigationbarios7uitoolbar
85
Ben Packard

Swift 3 (iOS 10)

Transparent UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: .any,
                                barMetrics: .default)
self.toolbar.setShadowImage(UIImage(), forToolbarPosition: .any)

Transparent UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.isTranslucent = true

Swift <3

Transparent UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: UIBarPosition.Any,
                                barMetrics: UIBarMetrics.Default)
self.toolbar.setShadowImage(UIImage(),
                            forToolbarPosition: UIBarPosition.Any)

Transparent UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.translucent = true

Objectif c

Transparent UIToolbar

[self.toolbar setBackgroundImage:[UIImage new]
              forToolbarPosition:UIBarPositionAny
                      barMetrics:UIBarMetricsDefault];
[self.toolbar setShadowImage:[UIImage new]
          forToolbarPosition:UIBarPositionAny];

Transparent UINavigationBar

[self.navigationBar setBackgroundImage:[UIImage new]
                         forBarMetrics:UIBarMetricsDefault];
self.navigationBar.shadowImage = [UIImage new];
self.navigationBar.translucent = YES;

Discussion

Définir translucent sur YES dans la barre de navigation suffit, en raison d'un comportement décrit dans la documentation UINavigationBar . Je vais signaler ici le fragment pertinent:

Si vous définissez cette propriété sur YES dans une barre de navigation avec une image d'arrière-plan personnalisée opaque, la barre de navigation appliquera une opacité système inférieure à 1,0 à l'image.

Résultat final

final result

297
Gabriele Petronella

Si vous souhaitez le faire via l'application entière, vous devez utiliser le proxy UIAppearance (iOS5 +):

UINavigationBar *navigationBarAppearance = [UINavigationBar appearance]; navigationBarAppearance.backgroundColor = [UIColor clearColor]; [navigationBarAppearance setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault]; navigationBarAppearance.shadowImage = [[UIImage alloc] init];

Docs: https://developer.Apple.com/library/ios/documentation/UIKit/Reference/UIAppearance_Protocol/Reference/Reference.html

Article: http://nshipster.com/uiappearance/

7
Adam Waite

Essayer:

[navBar setBackgroundImage:[UIImage alloc] forBarMetrics:UIBarMetricsDefault];
2
Leo Natan

Je suis tombé par hasard sur le fait que si je créais une sous-classe UINavigationBar, puis une méthode vide -(void)drawRect:, j'obtiendrais une barre de navigation transparente. Je n'ai testé cela qu'avec iOS 7. *, mais cela semblait fonctionner!

0
jakenberg
@implementation MyCustomNavigationBar

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        [self setup];
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if (self) {
        [self setup];
    }
    return self;
}

- (void)setup {
    [self setupBackground];
}

- (void)setupBackground {
    self.backgroundColor = [UIColor clearColor];
    self.tintColor = [UIColor clearColor];

    // make navigation bar overlap the content
    self.translucent = YES; 
    self.opaque = NO;

    // remove the default background image by replacing it with a clear image
    [self setBackgroundImage:[self.class maskedImage] forBarMetrics:UIBarMetricsDefault];

    // remove defualt bottom shadow
    [self setShadowImage: [UIImage new]]; 
}

+ (UIImage *)maskedImage {
    const float colorMask[6] = {222, 255, 222, 255, 222, 255};
    UIImage *img = [UIImage imageNamed:@"nav-white-pixel-bg.jpg"];
    return [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];
}

@end
0
yelled