Jak umieścić obraz na środku paska nawigacyjnego kontrolera UIViewController?

Question

Mam ten fragment kodu używany w viewDidLoad z UIViewController. Nie mam żadnych błędów. Obrazy istnieją. Mam tło, ale nie obraz. Obraz jest rodzajem logo.

if ([self.navigationController.navigationBar respondsToSelector:@selector(setBackgroundImage:forBarMetrics:)]) { 

    /* Background of navigationBar. */ 
    UIImage * navigationBarImage = [UIImage imageNamed:@"01_navbar_portrait.png"]; 
    [self.navigationController.navigationBar setBackgroundImage:navigationBarImage forBarMetrics:UIBarMetricsDefault]; 

    /* Image in navigationBar */ 
    UIImage * logoInNavigationBar = [UIImage imageNamed:@"01_logo.png"]; 
    UIImageView * logoView = [[UIImageView alloc] init]; 
    [logoView setImage:logoInNavigationBar]; 
    self.navigationController.navigationItem.titleView = logoView; 

} 

Answer 1

UINavigationController zarządza pasek nawigacyjny patrząc na własność najwyższym, kontroler widoku navigationItem na stosie nawigacji. Aby zmienić widok na logo, musisz ustawić to w kontrolerze widoku, który używa logo (tj. Kontroler widoku root lub inny, który zostanie naciśnięty na stosie).

zrobić coś takiego w viewDidLoad swojego kontrolera widoku:

UIImage* logoImage = [UIImage imageNamed:@"logo.png"]; 
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:logoImage]; 

w przypadku, ustawiasz złą pozycję nawigacja:

// Oops... 
self.navigationController.navigationItem.titleView = logoView; 
// Should be this: 
self.navigationItem.titleView = logoView; 

Answer 2

Wystarczy podać to klatka po

logoView.frame = CGRectMake(initialize frame here); 

Następnie użyj następujących

[self.navigationItem setTitleView:logoView]; 

Answer 3

najpierw musimy utworzyć widok, które mają rozmiar taki sam jak pasek nawigacyjny następnie dodaj widok obrazu i ustaw jego ramkę tak, aby wyglądał na środku w pasku nawigacyjnym. Działa dla wszystkich wersji ios i automatycznie bierze rozmiar ja na urządzenie (siatkówka lub normalna) i działa jak magia.

UIView *headerView = [[UIView alloc] init]; 
headerView.frame = CGRectMake(0, 0, 320, 44); 

UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Header.png"]]; 
imgView.frame = CGRectMake(75, 0, 150, 44); 
imgView.contentMode = UIViewContentModeScaleAspectFit; 

[headerView addSubview:imgView]; 

navigationCtrl.navigationBar.topItem.titleView = headerView; 

[headerView release]; 
[imgView release]; 

Answer 4

Swift:

var logoImage:UIImage = UIImage(named: "logo_text")! 
self.navigationItem.titleView = UIImageView(image: logoImage) 

Answer 5

Może nie to, co masz na myśli, ale wpadłem na tą stronę szukając sposobu, aby zapewnić scentralizowany obraz tła na pasku nawigacyjnym, a więc w przypadku” tutaj na to ... tutaj jest jeden sposób.

Kradnąc trochę z another answer, możesz podzielić obraz na pierwszy plan i tło, a następnie zbudować nowy obraz, który rozciąga tło i wyśrodkuje plan, a następnie ustawić go jako obraz tła paska nawigacji. Budowanie wizerunku działa tak:

// build an image by stretching the bg, then merging it with the fg 
CGSize barSize = self.navController.navigationBar.frame.size; 
UIImage *fg = [UIImage imageNamed:@"some_fg"]; 
UIImage *bg = [[UIImage imageNamed:@"some_bg"] 
       resizableImageWithCapInsets:UIEdgeInsetsMake(0.f,1.f,0.f,1.f)]; 
UIGraphicsBeginImageContextWithOptions(barSize, NO, 0.0); 
[bg drawInRect:CGRectMake(0, 0, barSize.width, barSize.height)]; 
[fg drawInRect:CGRectMake((barSize.width-fg.size.width)/2.f, 
          0, 
          fg.size.width, 
          fg.size.height)]; 
// grab the merged images 
UIImage *img = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 

Answer 6

extension UINavigationController { 
func addLogoImage(image: UIImage, navItem: UINavigationItem) { 
    let imageView = UIImageView(image: image) 
    imageView.contentMode = .scaleAspectFit 
    imageView.translatesAutoresizingMaskIntoConstraints = false 

    let view = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 44)) 
    view.addSubview(imageView) 

    navItem.titleView = view 
    imageView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true 
    imageView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true 
    imageView.heightAnchor.constraint(equalTo: view.heightAnchor).isActive = true 
    imageView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true 

    view.heightAnchor.constraint(equalTo: navigationBar.heightAnchor).isActive = true 
    view.centerXAnchor.constraint(equalTo: navigationBar.centerXAnchor).isActive = true 
    view.centerYAnchor.constraint(equalTo: navigationBar.centerYAnchor).isActive = true 
} 
} 

Oto co używam.

Oczywiście, możesz potrzebować nieco więcej wiązań, aby nie kolidować z elementami przycisku paska prawego i lewego.