web-dev-qa-db-fra.com

Rendre la barre UINavigation transparente

Comment faites-vous un UINavigationBar transparent ? Bien que je veux que ses articles de barre restent visibles.

iosiphoneobjective-cuinavigationbartransparency
218
quano

Si quelqu'un se demande comment y parvenir sous iOS 7+, voici une solution (compatible iOS 6 également)

En Objective-C

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

Dans Swift 3 (iOS 10)

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

Dans Swift 2

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

Discussion

Définir translucent sur YES dans la barre de navigation suffit, en raison d'un comportement décrit dans le fichier UINavigationBar documentation. Je vais rapporter 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.

607
Gabriele Petronella

Dans iOS5, vous pouvez effectuer cette opération pour rendre la barre de navigation transparente:

nav.navigationBar.translucent = YES; // Setting this slides the view up, underneath the nav bar (otherwise it'll appear black)
const float colorMask[6] = {222, 255, 222, 255, 222, 255};
UIImage *img = [[UIImage alloc] init];
UIImage *maskedImage = [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];

[nav.navigationBar setBackgroundImage:maskedImage forBarMetrics:UIBarMetricsDefault]; 
[img release];
29
Alex Stanciu

De IOS7:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.view.backgroundColor = [UIColor clearColor];
[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
23
Damien Romito

Pour ceux qui veulent faire cela dans Swift 2.x:

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

ou Swift 3.x:

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
14
fuzz

Cela semble fonctionner:

@implementation UINavigationBar (custom)
- (void)drawRect:(CGRect)rect {}
@end

navigationController.navigationBar.backgroundColor = [UIColor clearColor];
10
quano

Après avoir fait ce que tout le monde a dit ci-dessus, à savoir:

navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController!.navigationBar.isTranslucent = true

... ma barre de navigation était toujours blanche . J'ai donc ajouté cette ligne:

navigationController?.navigationBar.backgroundColor = .clear

... et voilà! Cela semblait faire l'affaire. 

8
Clay Ellis

Le code ci-dessous développe la réponse principale choisie pour ce fil, afin de supprimer la bordure inférieure et de définir la couleur du texte:

  1. Les deux dernières lignes codées de ce code définissent la transparence. J'ai emprunté ce code à ce fil et cela a fonctionné parfaitement!

  2. La propriété "clipsToBounds" est le code que j'ai trouvé et qui supprime la bordure inférieure avec OR sans jeu de transparence (donc si vous décidez d'utiliser un fond blanc/noir/etc. À la place, il n'y aura toujours pas ligne de frontière).

  3. La ligne "teinteCouleur" (2ème ligne codée) place mon bouton de retour en gris clair

  4. J'ai gardé barTintColor en tant que sauvegarde. Je ne sais pas pourquoi la transparence ne fonctionnerait pas, mais si elle ne fonctionne pas, je veux mon bg blanc comme je l'avais auparavant

    let navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = UIColor.lightGray
navigationBarAppearace.barTintColor = UIColor.white
navigationBarAppearace.clipsToBounds = true
navigationBarAppearace.isTranslucent = true
navigationBarAppearace.setBackgroundImage(UIImage(), for: .default)
navigationBarAppearace.shadowImage = UIImage()
5
Dave G

Je sais que ce sujet est ancien, mais si les gens veulent savoir comment faire, sans surcharger la méthode drawRect.

Voici ce dont vous avez besoin:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.opaque = YES;
self.navigationController.navigationBar.tintColor = [UIColor clearColor];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
5
Sander

Solution C #/Xamarin

NavigationController.NavigationBar.SetBackgroundImage(new UIImage(), UIBarMetrics.Default);
NavigationController.NavigationBar.ShadowImage = new UIImage();
NavigationController.NavigationBar.Translucent = true;
2
Mark Moeykens

Essayez le morceau de code suivant:

self.navigationController.navigationBar.translucent = YES;
2
Russian

pour Swift 3.0:

override func viewDidLoad() {
    super.viewDidLoad()

    navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
    navigationController?.navigationBar.shadowImage = UIImage()
    navigationController?.navigationBar.isTranslucent = true
}
2
Wilson

Une autre façon qui a fonctionné pour moi est de sous-classer UINavigationBar et de laisser la méthode drawRect vide !!

@IBDesignable class MONavigationBar: UINavigationBar {


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func drawRect(rect: CGRect) {
    // Drawing code
}}
1
M.Othman

Cela fonctionne pour Swift 2.0. 

navigationController!.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
navigationController!.navigationBar.shadowImage = UIImage()
navigationController!.navigationBar.translucent = true
0
Chris3643

Voulez-vous dire tout à fait transparent, ou en utilisant le style noir translucide vu dans l'application Photos? Vous pouvez accomplir ce dernier en définissant sa propriété barStyle sur UIBarStyleBlackTranslucent. L'ancien ... Je ne suis pas sûr de. Si vous souhaitez que les éléments qui s'y trouvent soient toujours visibles, vous devrez peut-être creuser dans la hiérarchie des vues de la barre et supprimer la vue contenant son arrière-plan.

0
Noah Witherspoon

Vérifiez RRViewControllerExtension , dédié à la gestion de l'apparence de la barre UINavigation.

avec RRViewControllerExtension dans votre projet, il vous suffit de remplacer

-(BOOL)prefersNavigationBarTransparent;

dans vous viewcontroller.

 navigation bar tranparent

0
Roen

Dans Swift 4.2

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

(dans viewWillAppear), puis dans viewWillDisappear, pour l'annuler, mettez

self.navigationController?.navigationBar.shadowImage = nil
self.navigationController?.navigationBar.isTranslucent = false
0
auspicious99