จะเพิ่ม 2 ปุ่มใน UINavigationbar ทางด้านขวาโดยไม่ใช้ IB ได้อย่างไร?


86

ฉันจะเพิ่ม 2 ปุ่มในUINavigationBarโดยไม่มี XIB ได้อย่างไร
ควรจัดเรียงปุ่ม 2 ปุ่มทางด้านขวาของไฟล์UINavigationBar.

ฉันรู้ว่าฉันจะเพิ่มปุ่มเดียวได้อย่างไร แต่สองปุ่มล่ะ?

คำตอบ:


142

ด้วย iOS 5+ มันง่ายเหมือน:

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

ฉันคิดว่ามันมีให้ใน iOS 5 เช่นกัน
iAmd

1
ดีและเรียบง่าย! ฉันยังรวมปุ่มขวาที่มีอยู่ (ตั้งค่าใน IB) UIBarButtonItem * btnCurrent = self.navigationItem.rightBarButtonItem;
Duncan

43

ฉันโพสต์รหัส (ดูด้านล่าง) เพื่อเพิ่มปุ่มสองปุ่มทางด้านขวาของ navigationBar คุณสามารถตั้งค่าbarStyle = -1แทนการคลาสย่อย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];

นี่เป็นโพสต์แรกที่ฉันพบว่ามีการตั้งค่าแถบเครื่องมือเพิ่มเติมที่ทำให้ใช้งานได้กับสีพื้นหลังที่แตกต่างกันขอบคุณ
Chris

นี่คือคำตอบที่ถูกต้องสำหรับคำถามนี้ .... โค้ดในลิงค์นี้ทำงานได้อย่างสมบูรณ์ ... คุณสุดยอดคน ... ไชโย ... :) คำตอบอื่น ๆ ทั้งหมดในข้างต้นผิดและใช้ไม่ได้
Sameera Chathuranga

โซลูชันทำงานได้ไม่สมบูรณ์เมื่อคุณนำเสนอ navigationController เป็น contentViewController ของ UIPopoverController เมื่อคุณตั้งค่า UIToolbar เป็นมุมมองแบบกำหนดเองของ leftBarButtonItem พื้นที่สัมผัสของปุ่มที่สองไม่ถูกต้อง (เลื่อนไปทางซ้ายซึ่งหมายความว่าด้านขวาของปุ่มที่สองไม่สามารถคลิกได้) เมื่อพูดถึง rightBarButtonItem ปุ่มที่สองจะวาดผิด (วาดเฉพาะด้านซ้ายของมัน) ... ในกรณีนี้ฉันจะต้องใช้ UIToolbar ที่กำหนดเองเป็นส่วนหัวแทน UINavigationBar ฉันคิดว่า ...
manicaesar

1
หนึ่งในเทคนิคที่นี่คือtools.barStyle = -1บรรทัด: หากคุณใช้ UIBarStyleBlack แบบโปร่งแสง = ใช่ (เช่นสีพื้นหลังไม่ตรงกับแถบนำทาง) นั่นเป็นคุณสมบัติที่ไม่มีเอกสารหรือไม่? ถ้าเป็นเช่นนั้นรหัสนี้ค่อนข้างเปราะบาง ฉันไม่เห็นสิ่งนั้นจากที่ใดในเอกสาร
ettore

28

คุณสามารถใช้ปุ่มแถบเริ่มต้นด้วยแถบเครื่องมือเป็นมุมมองแบบกำหนดเอง

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

จะให้สิ่งนี้:

ข้อความแสดงแทน

หมายเหตุ: คำตอบนี้ล้าสมัยสำหรับ iOS 6 หรือใหม่กว่า


3
@SameeraChathuranga คุณไม่สามารถคัดลอกและวางรหัสนี้โดยไม่ต้องทำอะไรเลย คุณต้องแน่ใจว่า 'self.editButtonItem' & 'someOtherButton' ถูกกำหนดไว้ที่ใดที่หนึ่งก่อน ...
นาธาน

ไฮ! ขอบคุณสำหรับข้อมูลโค้ด ใช้สิ่งนั้นฉันเพิ่มสองปุ่มสำเร็จ แต่มีปัญหาเล็กน้อย นี่คือลักษณะ อย่างที่คุณเห็นจะเห็นเส้นขอบคล้ายสี่เหลี่ยมเล็กน้อยรอบ ๆ แถบเครื่องมือ ฉันจะลบสิ่งนี้และทำให้มันราบรื่นเหมือนที่คุณมีในภาพหน้าจอด้านบนได้อย่างไร ขอบคุณ. :)
Isuru

แปลกฉันไม่เห็นเส้นขอบที่ปุ่ม "เพิ่ม" ฉันจะได้รับเส้นขอบถ้าฉันใช้ UIBarButtonStyles ที่ไม่มีไอคอน
pojo

23

นี่คือตัวอย่างการทำงานจากโครงการปัจจุบันของฉัน:

สองปุ่มใน UINavigationbar 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];

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

14

รวดเร็ว:

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)

วิธีการสำหรับปุ่ม:

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

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

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

9

SWIFT

คุณสามารถทำได้อย่างรวดเร็วเช่นนี้

        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){
        
        }

7

คุณสามารถสร้าง UIView และเพิ่มปุ่มสองปุ่มในมุมมองนั้นได้ และเพิ่ม UIView นั้นเป็นปุ่มขวา :)

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

self.navigationItem.rightBarButtonItem = rightItem;

@NathanReed มันควรจะเป็นself.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView: rightItem];(ตัวอย่างโค้ดการทำงานแบบเต็มด้านล่าง [โดยฉัน])
Adnan

7

การตอบสนองของ Prakash ยังใช้งานได้ในตัวสร้างอินเทอร์เฟซ

ลาก a UIViewเข้าUINavigationItemมาจากนั้นคุณสามารถใส่หลาย ๆ ตัวUIButtonเป็นลูกของสิ่งนี้UIViewและสร้างลำดับชั้นดังนี้:

แถบนำทางที่มีลำดับชั้น 3 ปุ่ม

ตั้งค่าสีพื้นหลังของUIViewเพื่อล้างและเพิ่มข้อ จำกัด บางอย่างเพื่อจัดกึ่งกลางปุ่มในแนวตั้งและกำหนดตำแหน่งแนวนอน นี่คือผลลัพธ์ที่ฉันได้รับโดยมีรหัสบรรทัดเป็นศูนย์:

ผลลัพธ์ในโปรแกรมจำลอง


1
ได้ผล! สำหรับผู้ที่สับสนเหมือนฉันสิ่งที่ฉันทำคือเปลี่ยนรายการปุ่มบาร์ด้วย UIView แทนโดยลากไปที่ UINavigationItem ตามที่อธิบายไว้ หลังจากนั้นจะเหมือนกับการลากปุ่มไปยังฉากของคุณและเพิ่มข้อ จำกัด ความรุ่งโรจน์สำหรับโซลูชันนี้เนื่องจากไม่มีรหัสใด ๆ ตอนนี้ฉันสามารถทำสิ่งนี้ได้พร้อมกับการสร้างฉากต่อเนื่องไปยังฉากต่างๆโดยเพียงแค่ลากปุ่มในสตอรี่บอร์ด :) ขอบคุณ!
Bruce

2
สิ่งนี้ไม่จำเป็นเลย คุณสามารถลากรายการปุ่มแถบไปที่ปุ่มแถบด้านขวา Xcode 7.3.1
João Nunes

4

ใน SWIFT คุณสามารถเพิ่มรหัสนี้เพื่อตั้งค่าปุ่มสองปุ่มทางด้านขวา (หรือซ้าย):

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

3

ตั้งแต่ iOS 5 เป็นต้นไปมันเป็นเรื่องง่ายที่จะบรรลุ UINavigationItem มีความสามารถในการมีปุ่มหลายปุ่มทางด้านซ้ายและด้านขวาของแถบ

http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UINavigationItem_Class/Reference/UINavigationItem.html#//apple_ref/occ/instm/UINavigationItem/setRightBarButtonItems : โดยประมาณ:


3

นี่คือรหัส 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){

  }

2

คุณไม่จำเป็นต้องเพิ่มปุ่มสองปุ่ม คุณเพียงแค่ต้องเพิ่ม

UIBarButtonSystemItemFlexibleSpace 

ไม่

UIBarButtonSystemItemFixedSpace

และปุ่มเพื่อให้อยู่ทางด้านขวา

แบบนี้:

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

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;

1

ในกรณีที่มีคนมาที่นี่เช่นฉันกำลังมองหาคำตอบของ MonoTouch อย่ามองไปไกลกว่าNavigationItem.RightBarButtonItemsอาร์เรย์


1

ใน SWIFT:

(สมมติว่าคุณมีตัวควบคุมการนำทาง) ใน Root Controller ให้ใช้รหัสนี้:

ซ้าย: ..

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

ขวา:

    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;

..

ที่ไหน:

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

}

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)
    }
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.