Como criar uma barra de navegação completamente transparente no iOS 7

127

Quero que o UINavigationBar no meu aplicativo seja completamente transparente e nivelado com o viewcontroller diretamente abaixo dele. No entanto, o único código que encontrei o torna translúcido, mas não transparente. Eu sei que isso pode ser feito no iOS 7, porque é usado no aplicativo de notas. Minha pergunta é: qual é o código que eles usaram para fazer isso?

Cory Ginsberg
fonte

Respostas:

295

A partir desta resposta

[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];

Além disso, conforme sugerido por Josh nos comentários, para colocar a barra de volta ao padrão:

[self.navigationController.navigationBar setBackgroundImage:nil
                     forBarMetrics:UIBarMetricsDefault];
Alan
fonte
6
Também certifique-se que você não temself.edgesForExtendedLayout = UIRectEdgeNone;
daidai
25
Existe uma maneira de reverter isso?
Zorayr
12
@Zorayr [self.navigationController.navigationBar setBackgroundImage: zero paraBarMetrics: UIBarMetricsDefault]; colocará a barra de volta no padrão.
214 Josh Josh
7
Existe alguma maneira de alternar a transparência da barra de navegação animada usando esse método?
JYC
3
Eu implemento isso no scrollViewDidScroll e há um salto. Como consertar?
onmyway133
77

Para Swift3 e Swift4

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

Para Swift2.2

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

Para Objective-C

[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
vichhai
fonte
1
Graças esta é uma maneira fácil de definir a barra de navegação para totalmente transparente
Hong Zhou
39

Solução independente como uma categoria 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

Agora, você pode importar a categoria no seu UIViewControllere chamar os métodos no seu controlador de navegação - por exemplo:

#import "UINavigationController+TransparentNavigationController.h"

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

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

E uma solução semelhante no 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
fonte
Como posso mostrá-lo novamente (por exemplo, se não quiser torná-lo transparente apenas em 1 exibição em um NavigationController?) - posso redefini-lo para meus valores padrão?
Derdida
hideTransparentNavigationBar()deve redefini-lo de volta.
Zorayr 7/08/15
A chamada de métodos presente / oculto no viewWillAppear / desaparecer causa uma animação de transição incorreta entre as duas barras de navegação diferentes! Você pode vê-lo muito bem, fazendo o gesto de furto (da esquerda para a direita) na pushedViewController
andreacipriani
Tente ligar para viewDidHideo controlador de exibição pai.
Zorayr 9/09/15
1
Fundo preto é mostrado no iOS 11 ao usar LargeTitle ao esconder barra de navegação transparente
Vrutin Rathod
15

Alan esqueceu uma linha

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

Então eu tenho:

[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
fonte
5

A grande resposta de @ Zorayr revisada para 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
fonte
2

Swift 4.2 e iOS 12

Acontece que tudo o que você realmente precisa é do código abaixo. Funciona perfeitamente quando você o coloca 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
fonte
-3

Use o pod UINavigationBar + Addition e simplesmente chame:

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

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

Essa linha parecia funcionar perfeitamente para mim

user5679976
fonte