Como adicionar 2 botões na barra de navegação UIN no lado direito sem IB?

86

Como posso adicionar 2 botões no UINavigationBarsem XIB?
Os 2 botões devem ser alinhados no lado direito do UINavigationBar.

Eu sei como posso adicionar um botão, mas que tal dois?

Alexandre
fonte

Respostas:

142

Com iOS 5+ é tão fácil quanto:

UIBarButtonItem *btnShare = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemAction target:self action:@selector(share)];
UIBarButtonItem *btnRefresh = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh target:self action:@selector(refresh)];
[self.navigationItem setRightBarButtonItems:[NSArray arrayWithObjects:btnShare, btnRefresh, nil]];
domsom
fonte
Acho que está disponível no iOS 5 também.
iAmd de
1
Bom e simples! Também incluí o botão direito existente (definido em IB) UIBarButtonItem * btnCurrent = self.navigationItem.rightBarButtonItem;
Duncan
43

Eu publicou um código (ver abaixo) para adicionar dois botões à direita do NavigationBar. Você pode definir em barStyle = -1vez de subclassificar UIToolbar.

UIToolbar *tools = [[UIToolbar alloc]
                    initWithFrame:CGRectMake(0.0f, 0.0f, 103.0f, 44.01f)]; // 44.01 shifts it up 1px for some reason
tools.clearsContextBeforeDrawing = NO;
tools.clipsToBounds = NO;
tools.tintColor = [UIColor colorWithWhite:0.305f alpha:0.0f]; // closest I could get by eye to black, translucent style.
                                                              // anyone know how to get it perfect?
tools.barStyle = -1; // clear background
NSMutableArray *buttons = [[NSMutableArray alloc] initWithCapacity:3];

// Create a standard refresh button.
UIBarButtonItem *bi = [[UIBarButtonItem alloc]
    initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh target:self action:@selector(refresh:)];
[buttons addObject:bi];
[bi release];

// Create a spacer.
bi = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
bi.width = 12.0f;
[buttons addObject:bi];
[bi release];

// Add profile button.
bi = [[UIBarButtonItem alloc] initWithTitle:@"Profile" style:UIBarButtonItemStylePlain target:self action:@selector(goToProfile)];
bi.style = UIBarButtonItemStyleBordered;
[buttons addObject:bi];
[bi release];

// Add buttons to toolbar and toolbar to nav bar.
[tools setItems:buttons animated:NO];
[buttons release];
UIBarButtonItem *twoButtons = [[UIBarButtonItem alloc] initWithCustomView:tools];
[tools release];
self.navigationItem.rightBarButtonItem = twoButtons;
[twoButtons release];
ma11hew28
fonte
esta foi a primeira postagem que descobri que incluía uma configuração extra de barra de ferramentas que a fazia funcionar com diferentes cores de fundo, obrigado
Chris,
Esta é a resposta correta para esta pergunta ... O código neste link está funcionando perfeitamente ... seu homem incrível ... gritos ... :) Todas as outras respostas acima estão erradas e não estão funcionando
Sameera Chathuranga
A solução não funciona perfeitamente, quando você apresenta o navigationController como um contentViewController de UIPopoverController. Quando você define UIToolbar como uma visualização personalizada de leftBarButtonItem, a área de toque do segundo botão está incorreta (deslocada para a esquerda, o que significa que o lado direito do segundo botão não pode ser clicado). Quando se trata de rightBarButtonItem, o segundo botão é desenhado incorretamente (apenas o lado esquerdo dele é desenhado) ... Nesse caso, terei que usar UIToolbar personalizado como cabeçalho em vez de UINavigationBar, eu acho ...
manicaesar
1
Um dos truques aqui é a tools.barStyle = -1linha: sem ela existem alguns artefatos visuais se você usar UIBarStyleBlack com translucent = YES. (Ou seja, a cor de fundo não corresponde à da barra de navegação.) Esse é um recurso não documentado? Nesse caso, este código é um pouco frágil. Eu não vi isso em nenhum lugar nos documentos.
Ettore
28

Você pode usar um botão de barra inicializado com uma barra de ferramentas como uma visualização personalizada.

UIToolbar* toolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 103.0f, 44.01f)];
NSArray* buttons = [NSArray arrayWithObjects:self.editButtonItem, someOtherButton, nil];
[toolbar setItems:buttons animated:NO];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:toolbar];

Daria algo assim:

texto alternativo

Observação: esta resposta é obsoleta para iOS 6 ou posterior

Nathan
fonte
3
@SameeraChathuranga você não pode simplesmente copiar e colar este código sem fazer nada. Você deve se certificar de que 'self.editButtonItem' e 'someOtherButton' estão definidos em algum lugar primeiro ...
Nathan
Oi! Obrigado pelo snippet. Usando isso, adicionei dois botões com sucesso, mas há um pequeno problema. Aqui está o que parece. Como você pode ver, uma leve borda quadrada é visível ao redor da barra de ferramentas. Como posso removê-lo e torná-lo transparente, como na captura de tela acima? Obrigado. :)
Isuru
Estranho, não entendi a borda do botão "adicionar". Só recebo uma borda se usar UIBarButtonStyles que não têm um ícone.
pojo
23

Aqui está o exemplo de trabalho do meu projeto atual:

dois botões na barra de navegação UIN rightBarButtonItem

UIButton *homeBtn =  [UIButton buttonWithType:UIButtonTypeCustom];
[homeBtn setImage:[UIImage imageNamed:@"home-icon"] forState:UIControlStateNormal];
//[homeBtn addTarget:self action:@selector(home) forControlEvents:UIControlEventTouchUpInside];
[homeBtn setFrame:CGRectMake(0, 0, 32, 32)];

UIButton *settingsBtn =  [UIButton buttonWithType:UIButtonTypeCustom];
[settingsBtn setImage:[UIImage imageNamed:@"settings-icon"] forState:UIControlStateNormal];
//[settingsBtn addTarget:self action:@selector(settings) forControlEvents:UIControlEventTouchUpInside];
[settingsBtn setFrame:CGRectMake(44, 0, 32, 32)];

UIView *rightBarButtonItems = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 76, 32)];
[rightBarButtonItems addSubview:homeBtn];
[rightBarButtonItems addSubview:settingsBtn];

self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:rightBarButtonItems];
Adnan
fonte
18
UINavigationBar *navBarView = [[UINavigationBar alloc] initWithFrame: CGRectMake(0.0f, 0.0f, 320.0f, 42.0f)];
    navBarView.tintColor= [UIColor colorWithRed:90.0/255.0f green:53.0/255.0f blue:45.0/255.0f alpha:1.0];

    UIBarButtonItem *left=[[UIBarButtonItem alloc]initWithTitle:@"Back" style:UIBarButtonItemStylePlain target:self action:@selector(backView)];
    UIBarButtonItem *right=[[UIBarButtonItem alloc]initWithTitle:@"Save" style:UIBarButtonItemStylePlain target:self action:@selector(SaveImage)];
    UIBarButtonItem *Add=[[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemAdd target:self action:@selector(AddComment:)];

    UINavigationItem *navigationItem = [[UINavigationItem alloc] init];
    navigationItem.leftBarButtonItem = left;
    NSMutableArray *buttonArray=[[NSMutableArray alloc]initWithCapacity:2];
    [buttonArray addObject:right];
    [buttonArray addObject:Add];
    navigationItem.rightBarButtonItems = buttonArray;
    [navBarView pushNavigationItem:navigationItem animated:NO];
[self.view addSubView:navBarView];
Gurpreet Singh
fonte
14

Rápido:

override func viewDidLoad() {
    super.viewDidLoad()

    // Additional bar button items
    let button1 = UIBarButtonItem(image: UIImage(named: "image1.png"), style: .Plain, target: self, action: "methodA")
    let button2 = UIBarButtonItem(image: UIImage(named: "image2.png"), style: .Plain, target: self, action: "methodB")
    let button3 = UIBarButtonItem(image: UIImage(named: "image3.png"), style: .Plain, target: self, action: "methodC")

    navigationItem.leftItemsSupplementBackButton = true
    navigationItem.setLeftBarButtonItem(button1, animated: true)
    navigationItem.setRightBarButtonItems([button2, button3], animated: true)

Métodos para botões:

func methodA() {
    performSegueWithIdentifier("segA", sender: nil)
}

func methodB() {
    performSegueWithIdentifier("segB", sender: nil)
}

func methodC() {
    performSegueWithIdentifier("segC", sender: nil)
}
LondonGuy
fonte
9

RÁPIDO

Você pode fazer em rápida como esta

        var editImg   : UIImage = UIImage(named: "plus")!
        var searchImg : UIImage = UIImage(named: "search")!
        
        var editBtn : UIBarButtonItem = UIBarButtonItem(image: editImg,  style: UIBarButtonItemStyle.Plain, target: self, action: Selector("editBtnPressed:"))
        
        var searchBtn : UIBarButtonItem = UIBarButtonItem(image: searchImg,  style: UIBarButtonItemStyle.Plain, target: self, action: Selector ("searchBtnPressed:"))
        
        var buttons : NSArray = [editBtn, searchBtn]
        
        self.navigationItem.rightBarButtonItems = buttons

        func editBtnPressed(sender: AnyObject){
        
        }
    
        func searchBtnPressed(sender: AnyObject){
        
        }
Dharmbir Singh
fonte
7

Você pode criar um UIView e adicionar dois botões nessa visualização. E adicione esse UIView como botão direito :)

UIView* rightItem = [UIView alloc] initWithFrame:frame];
//Create UIButton1 b1
//Create UIButton2 b2
[rightItem addSubview:b1];
[rightItem addSubview:b2];

self.navigationItem.rightBarButtonItem = rightItem;
prakash
fonte
@NathanReed, deveria ser self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView: rightItem];(amostra de código de funcionamento completo abaixo [por mim])
Adnan
7

A resposta de Prakash também funciona no construtor de interface.

Arraste um UIViewno UINavigationItem, então você pode colocar vários UIButtoncomo filhos deste UIViewe criar uma hierarquia como esta:

Barra de navegação com hierarquia de 3 botões

Defina a cor de fundo de UIViewpara limpar e adicione algumas restrições para centralizar verticalmente os botões e corrigir a posição horizontal. Aqui está o resultado que obtive com linha zero de código:

Resultado no simulador

Axel Guilmin
fonte
1
Isso funciona! Para aqueles que estão tão confusos quanto eu, o que fiz foi substituir o item do botão Bar pelo UIView, arrastando-o para o UINavigationItem conforme descrito. Depois disso, será exatamente o mesmo que arrastar botões para sua cena e adicionar restrições. Parabéns por esta solução, porque sem nenhum código agora posso fazer isso, além de criar um segue para diferentes cenas apenas arrastando os botões no storyboard :) Obrigado!
Bruce
2
Isso não é necessário. Você pode simplesmente arrastar os itens do botão da barra para o botão da barra direita. Xcode 7.3.1
João Nunes
4

Em SWIFT, você pode adicionar este código para configurar dois botões no lado direito (ou esquerdo):

self.navigationItem.rightBarButtonItems = [UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.Action, target: self, action: "barButtonItemClicked"), UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.Search, target: self, action: "barButtonItemClicked")]
Alberto Bailac Moreno
fonte
3

Aqui está o código do Swift 4:

    let editImage   = UIImage(named: "plus")!
    let searchImage = UIImage(named: "search")!
    let editButton   = UIBarButtonItem(image: editImage,  style: .plain, target: self, action:#selector(didTapEditButton))
    let searchButton = UIBarButtonItem(image: searchImage,  style: .plain, target: self, action:#selector(didTapSearchButton))
    navigationItem.rightBarButtonItems = [editButton, searchButton]


 @objc func didTapEditButton(sender: AnyObject){

  }

 @objc func didTapSearchButton(sender: AnyObject){

  }
Mannam Brahmam
fonte
2

Você não precisa adicionar dois botões. Você só precisa adicionar

UIBarButtonSystemItemFlexibleSpace 

não

UIBarButtonSystemItemFixedSpace

e um botão, para que fique do lado direito.

Como isso:

UIToolbar *toolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
toolbar.barStyle = UIBarStyleBlackTranslucent;

UIBarButtonItem *spaceButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];

UIBarButtonItem *infoButtonItem1 = [[UIBarButtonItem alloc] initWithTitle:@"Done" style:UIBarButtonItemStyleDone target:self action:@selector(empresaTextFieldDone)];    

toolbar.items = [NSArray arrayWithObjects: spaceButton, infoButtonItem1, nil];   
bruno
fonte
2
UIView* buttonsView= [[UIView alloc] initWithFrame:CGRectMake(10, 6, 84, 32)];
buttonsView.backgroundColor=[UIColor clearColor];

btn_back = [UIButton buttonWithType:UIButtonTypeCustom];
[btn_back addTarget:self action:@selector(backButtonClick) 
forControlEvents:UIControlEventTouchUpInside];
btn_back.frame = CGRectMake(0, 0, 32, 32);
btn_back.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"close.png"]];

btn_help = [UIButton buttonWithType:UIButtonTypeCustom];
[btn_help addTarget:self action:@selector(helpButtonClick) 
 forControlEvents:UIControlEventTouchUpInside];
btn_help.frame = CGRectMake(42, 0, 32, 32);
btn_help.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"info.png"]];

[buttonsView addSubview:btn_back];
[buttonsView addSubview:btn_help];

segmentItem = [[UIBarButtonItem alloc] initWithCustomView:buttonsView];
self.navigationItem.rightBarButtonItem = segmentItem;
SURESH SANKE
fonte
1

No caso de alguém vir aqui, como eu, em busca de uma resposta MonoTouch, basta procurar NavigationItem.RightBarButtonItemsarray.

Dan Abramov
fonte
1

em SWIFT:

(suponha que você tenha um controlador de navegação) no controlador raiz use este código:

esquerda: ..

    let leftBtn =  UIBarButtonItem(title: "Do It", style: UIBarButtonItemStyle.Plain,
        target: self, action: "doIt:")
    leftBtn.tag=100
    self.navigationItem.leftBarButtonItem = leftBtn

certo:

    let rightView = UIView(frame:  CGRectMake(0, 0, 100, 30))
    rightView.backgroundColor = UIColor.redColor()

    let btn1 = UIButton(frame: CGRectMake(0,0,60, 20))
    btn1.setTitle("R1", forState: UIControlState.Normal)
    btn1.tag=101
    btn1.addTarget(self, action: "doIt:", forControlEvents: UIControlEvents.TouchUpInside)
    rightView.addSubview(btn1)

    let btn2 = UIButton(frame: CGRectMake(30,0,60, 20))
    btn2.setTitle("R2", forState: UIControlState.Normal)
    btn2.tag=102
    btn2.addTarget(self, action: "doIt:", forControlEvents: UIControlEvents.TouchUpInside)
    rightView.addSubview(btn2)


    let rightBtn = UIBarButtonItem(customView: rightView)
    self.navigationItem.rightBarButtonItem = rightBtn;

..

Onde:

 func doIt(sender: AnyObject!){
    let tag = sender.tag

}
ing.conti
fonte
0
    func makeCustomNavigationBar () {

        // Create the navigation bar
        let navigationBar = UINavigationBar(frame: CGRectMake(0, 20, self.view.frame.size.width, 44)) // Offset by 20 pixels vertically to take the status bar into account
        navigationBar.backgroundColor = UIColor.init(hexString: "E43037")
        navigationBar.delegate = self;

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

        // Create a navigation item with a title
        let navigationItem = UINavigationItem()
        navigationBar.tintColor = UIColor.whiteColor()

        navigationItem.title = "Forgot Password"
        navigationBar.titleTextAttributes = [NSForegroundColorAttributeName : UIColor.whiteColor()]

        // Create left and right button for navigation item
        let leftButton = UIBarButtonItem(title: "", style: UIBarButtonItemStyle.Plain, target: self, action: nil)
        leftButton.action = "returnToLoginView"

        let backbuttonImageView =  UIImageView(frame: CGRectMake(0, 0, 30, 30))
        backbuttonImageView.image = UIImage(named: "nav-arrow-left")
        leftButton.image = backbuttonImageView.image
        navigationItem.leftBarButtonItem = leftButton


let rightButton = UIBarButtonItem(title: "Right", style: UIBarButtonItemStyle.Plain, target: self, action: nil)
        rightButton.action = "navigateToDashBoardView"

        let rightButtonImageView =  UIImageView(frame: CGRectMake(0, 0, 30, 30))
        rightButtonImageView.image = UIImage(named: "nav-arrow-left")
        rightButton.image = backbuttonImageView.image
        navigationItem.rightBarButtonItem = rightButton

        // Assign the navigation item to the navigation bar
        navigationBar.items = [navigationItem]

        // Make the navigation bar a subview of the current view controller
        self.view.addSubview(navigationBar)
    }
AG
fonte