Comment rendre la barre de navigation complètement transparente dans iOS 7

127

Je veux que UINavigationBar dans mon application soit complètement transparent et affleure avec le viewcontroller directement en dessous. Cependant, le seul code que j'ai pu trouver le rend translucide mais pas transparent. Je sais que cela peut être fait dans iOS 7 car il est utilisé dans l'application Notes. Ma question est, quel est le code qu'ils ont utilisé pour le faire?

cory ginsberg
la source

Réponses:

295

De cette réponse

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

Aussi, comme suggéré par Josh dans les commentaires, pour remettre la barre par défaut:

[self.navigationController.navigationBar setBackgroundImage:nil
                     forBarMetrics:UIBarMetricsDefault];
Alan
la source
6
Assurez-vous également que vous n'avez pasself.edgesForExtendedLayout = UIRectEdgeNone;
daidai
25
Y a-t-il un moyen d'inverser cela?
Zorayr
12
@Zorayr [self.navigationController.navigationBar setBackgroundImage: nil forBarMetrics: UIBarMetricsDefault]; remettra la barre par défaut.
Josh
7
Existe-t-il un moyen de basculer la transparence de la barre de navigation animée à l'aide de cette méthode?
JYC
3
J'implémente ceci sur scrollViewDidScroll et il y a un saut. Comment réparer?
onmyway133
77

Pour Swift3 et Swift4

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

Pour Swift2.2

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

Pour Objective-C

[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
Vichhai
la source
1
Merci, c'est un moyen facile de définir la barre de navigation sur totalement transparente
Hong Zhou
39

Solution autonome en tant que catégorie Objective-C:

UINavigationController + TransparentNavigationController.h

@interface UINavigationController (TransparentNavigationController)
- (void)presentTransparentNavigationBar;
- (void)hideTransparentNavigationBar;
@end

UINavigationController + TransparentNavigationController.m

#import "UINavigationController+TransparentNavigationController.h"

@implementation UINavigationController (TransparentNavigationController)

- (void)presentTransparentNavigationBar
{
  [self.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
  [self.navigationBar setTranslucent:YES];
  [self.navigationBar setShadowImage:[UIImage new]];
  [self setNavigationBarHidden:NO animated:YES];
}

- (void)hideTransparentNavigationBar
{
  [self setNavigationBarHidden:YES animated:NO];
  [self.navigationBar setBackgroundImage:[[UINavigationBar appearance] backgroundImageForBarMetrics:UIBarMetricsDefault] forBarMetrics:UIBarMetricsDefault];
  [self.navigationBar setTranslucent:[[UINavigationBar appearance] isTranslucent]];
  [self.navigationBar setShadowImage:[[UINavigationBar appearance] shadowImage]];
}

@end

Maintenant, vous pouvez importer la catégorie dans votre UIViewControlleret appeler les méthodes sur votre contrôleur de navigation - par exemple:

#import "UINavigationController+TransparentNavigationController.h"

- (void)viewWillAppear:(BOOL)animated
{
  [super viewWillAppear:animated];
  [self.navigationController presentTransparentNavigationBar];
}

- (void)viewWillDisappear:(BOOL)animated
{
  [super viewWillDisappear:animated];
  [self.navigationController hideTransparentNavigationBar];
}

Et une solution similaire dans Swift :

import Foundation
import UIKit

extension UINavigationController {

  public func presentTransparentNavigationBar() {
    navigationBar.setBackgroundImage(UIImage(), forBarMetrics:UIBarMetrics.Default)
    navigationBar.translucent = true
    navigationBar.shadowImage = UIImage()
    setNavigationBarHidden(false, animated:true)
  }

  public func hideTransparentNavigationBar() {
    setNavigationBarHidden(true, animated:false)
    navigationBar.setBackgroundImage(UINavigationBar.appearance().backgroundImageForBarMetrics(UIBarMetrics.Default), forBarMetrics:UIBarMetrics.Default)
    navigationBar.translucent = UINavigationBar.appearance().translucent
    navigationBar.shadowImage = UINavigationBar.appearance().shadowImage
  }
}
Zorayr
la source
Comment puis-je le montrer à nouveau (par exemple si je veux le rendre transparent uniquement dans 1 vue dans un NavigationController?) - Puis-je le réinitialiser à mes valeurs par défaut?
derdida
hideTransparentNavigationBar()devrait le réinitialiser.
Zorayr
L'appel des méthodes present / hide dans viewWillAppear / Disparaît entraînera une mauvaise animation de transition entre les deux barres de navigation différentes! Vous pouvez très bien le voir en faisant le geste de balayage (de gauche à droite) dans le pushViewController
andreacipriani
Essayez de l'appeler dans viewDidHidele contrôleur de vue parent.
Zorayr
1
Un fond noir s'affiche sur iOS 11 lors de l'utilisation de LargeTitle lors du masquage de la barre de navigation transparente
Vrutin Rathod
15

Alan a oublié une ligne

self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];

Donc j'ai:

[self.navigationController.navigationBar setTranslucent:YES];
self.navigationController.view.backgroundColor = [UIColor clearColor];
[self.navigationController.navigationBar setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
Damien Romito
la source
5

La grande réponse de @ Zorayr révisée à Swift 3:

import Foundation
import UIKit

extension UINavigationController {

    public func presentTransparentNavigationBar() {
        navigationBar.setBackgroundImage(UIImage(), for:.default)
        navigationBar.isTranslucent = true
        navigationBar.shadowImage = UIImage()
        setNavigationBarHidden(false, animated:true)
    }

    public func hideTransparentNavigationBar() {
        setNavigationBarHidden(true, animated:false)
        navigationBar.setBackgroundImage(UINavigationBar.appearance().backgroundImage(for: UIBarMetrics.default), for:.default)
        navigationBar.isTranslucent = UINavigationBar.appearance().isTranslucent
        navigationBar.shadowImage = UINavigationBar.appearance().shadowImage
    }
}
Diphaze
la source
2

Swift 4.2 et iOS 12

Il s'avère que tout ce dont vous avez vraiment besoin est le code ci-dessous. Cela fonctionne parfaitement lorsque vous le mettez viewDidLoad().

// removes line at bottom of navigation bar
navigationController?.navigationBar.shadowImage = UIImage()

// makes navigation bar completely transparent
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationController?.navigationBar.isTranslucent = true
Trev14
la source
-3

Utilisez le pod UINavigationBar + Addition , puis appelez simplement:

UINavigationBar *navigationBar = self.navigationController.navigationBar;
[navigationBar makeTransparent];
samwize
la source
-4

[(UIView *) [self.navigationController.navigationBar.subviews objectAtIndex: 0] setAlpha: 0.0f];

Cette ligne semblait fonctionner parfaitement pour moi

user5679976
la source