如何在Swift中向导航栏的右侧添加自定义视图？

Question

我正在尝试在UINavigationBar右侧添加一个自定义视图。我尝试了以下方法，但是视图没有出现！请帮忙解决，谢谢！

let viewOnrightButton = UIView(frame: CGRect(x: 2, y: 2, width: 60, height: 22))
 // viewOnrightButton.frame = CGRectMake(2, 2, 60, 22)
viewOnrightButton.layer.cornerRadius = 2
viewOnrightButton.backgroundColor = UIColor(red: 0.961, green: 0.827, blue: 0.239, alpha: 1.00)

lblNumbersOfBanana.frame = CGRectMake(2, 1, viewOnrightButton.frame.width-20, 20)
lblNumbersOfBanana.text = "001"

var bananaImgView = UIImageView(frame: CGRect(x: viewOnrightButton.frame.width-22, y: 0, width: 20, height: 20))
 //  bananaImgView.frame = CGRectMake(viewOnrightButton.frame.width-22, 0, 20, 20)
bananaImgView.image = UIImage(named: "banana")

viewOnrightButton.addSubview(lblNumbersOfBanana)
viewOnrightButton.addSubview(bananaImgView)

self.navigationItem.rightBarButtonItem?.customView = viewOnrightButton

- dip

Answer 1

// 创建一个UIView并添加三个自定义按钮

 func addRightButton(){

    let viewFN = UIView(frame: CGRectMake(0, 0, 180,40))
        viewFN.backgroundColor = UIColor.yellowColor()
    let button1 = UIButton(frame: CGRectMake(0,8, 40, 20))
    button1.setImage(UIImage(named: "notification"), forState: UIControlState.Normal)
    button1.setTitle("one", forState: .Normal)

    button1.addTarget(self, action: #selector(self.didTapOnRightButton), forControlEvents: UIControlEvents.TouchUpInside)

    let button2 = UIButton(frame: CGRectMake(40, 8, 60, 20))
    button2.setImage(UIImage(named: "notification"), forState: UIControlState.Normal)
    button2.setTitle("tow", forState: .Normal)
    let button3 = UIButton(frame: CGRectMake(80, 8, 60, 20))
     button3.setImage(UIImage(named: "notification"), forState: UIControlState.Normal)
    button3.setTitle("three", forState: .Normal)

    button3.addTarget(self, action: #selector(self.didTapOnRightButton), forControlEvents: UIControlEvents.TouchUpInside)

    viewFN.addSubview(button1)
    viewFN.addSubview(button2)
    viewFN.addSubview(button3)


    let rightBarButton = UIBarButtonItem(customView: viewFN)
    self.navigationItem.rightBarButtonItem = rightBarButton

}

- AyAz

Answer 2

被采纳答案的Swift 3/4/5版本

let viewFN = UIView(frame: CGRect.init(x: 0, y: 0, width: 180, height: 40))
viewFN.backgroundColor = .yellow
let button1 = UIButton(frame: CGRect.init(x: 0, y: 0, width: 40, height: 20))
button1.setImage(UIImage(named: "notification"), for: .normal)
button1.setTitle("one", for: .normal)

button1.addTarget(self, action: #selector(self.didTapOnRightButton), for: .touchUpInside)
let button2 = UIButton(frame: CGRect.init(x: 40, y: 8, width: 60, height: 20))
button2.setImage(UIImage(named: "notification"), for: .normal)
button2.setTitle("tow", for: .normal)
let button3 = UIButton(frame: CGRect.init(x: 80, y: 8, width: 60, height: 20))
button3.setImage(UIImage(named: "notification"), for: .normal)
button3.setTitle("three", for: .normal)

button3.addTarget(self, action: #selector(self.didTapOnRightButton), for: .touchUpInside)

viewFN.addSubview(button1)
viewFN.addSubview(button2)
viewFN.addSubview(button3)

let rightBarButton = UIBarButtonItem(customView: viewFN)

希望能对某些人有所帮助。干杯！

- Md. Ibrahim Hassan

Answer 3

您可以这样做，试一下：

var view = UIView(frame: CGRectMake(0, 0, 100, 44))
view.backgroundColor = UIColor.yellowColor()
var barButtonItem = UIBarButtonItem(customView: view)
self.navigationItem.rightBarButtonItem = barButtonItem

- iAnurag

Answer 4

我在viewWillAppear()中添加了这段代码，对我很有效

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    self.navigationController?.navigationBar.isHidden = false
    self.navigationItem.title = "Forgot Password?"
    self.navigationItem.leftBarButtonItem = UIBarButtonItem(customView:UIImageView(image: UIImage(named: "btn_back")))
}

- Antony Wong

Answer 5

您可以将UIStackView用作自定义视图。这非常方便。

class ViewController: UIViewController {

private lazy var firstButton: UIButton = {
    let button = UIButton()
    button.titleLabel?.text = "First"
    button.backgroundColor = .cyan
    button.addTarget(self,
                     action: #selector(firstButtonAction),
                     for: .touchUpInside)
    return button
}()

private lazy var secondButton: UIButton = {
    let button = UIButton()
    button.titleLabel?.text = "First"
    button.backgroundColor = .red
    button.addTarget(self,
                     action: #selector(secondButtonAction),
                     for: .touchUpInside)
    return button
}()

private lazy var stackView: UIStackView = {
    let stackView = UIStackView()
    stackView.axis = .horizontal
    stackView.spacing = 5
    return stackView
}()

override func viewDidLoad() {
    super.viewDidLoad()
    stackView.addArrangedSubview(firstButton)
    stackView.addArrangedSubview(secondButton)
    let barItem = UIBarButtonItem(customView: stackView)
    navigationItem.rightBarButtonItem = barItem
}

@objc private func firstButtonAction() {
    print("First button action")
}

@objc private func secondButtonAction() {
    print("Second button action")
}

}

- Pavel Paddubotski

Answer 6

我猜你的rightBarButtonItem是nil。相反，初始化一个新的UIBarButtonItem与你的自定义视图，并将其设置为rightBarButtonItem。试试看吧。

- HorseT

Answer 7

这是一个按钮的示例：

// Right Side
let rubricButton  = UIButton.buttonWithType(UIButtonType.System) as! UIButton
rubricButton.frame = CGRectMake(0, 0, 100, 32)  // Size
rubricButton.backgroundColor = UIColor.clearColor()
rubricButton.setTitle("Options", forState: UIControlState.Normal)
rubricButton.titleLabel!.font = UIFont(name: "Lato-Regular", size: 18)
rubricButton.addTarget(self, action: "showRubricList:", forControlEvents: UIControlEvents.TouchUpInside)  // Action
var rubricBarButtonItem: UIBarButtonItem = UIBarButtonItem(customView: rubricButton)  // Create the bar button

// Add the component to the navigation Bar
self.navigationItem.setRightBarButtonItems([rubricBarButtonItem], animated: false)

- Masterfego