iOS 确保条形按钮项目出现 Full-Size 在 iPhone SE 上的 UINavigationBar 中

Question

在我的应用程序中，我有一个导航栏，我在其中使用右侧的三个按钮。我是这样创建的：

let button1 = UIBarButtonItem(image: UIImage(named: "button1"),
                              style: .plain,
                              target: self,
                              action: #selector(self.button1Tapped))

// Repeat for button2 and button3

navigationItem.rightBarButtonItems = [button1, button2, button3]

除 iPhone SE 外，这按预期工作。右栏按钮可以占据导航栏宽度的百分比似乎有某种固定限制，并且在 iPhone SE 的小屏幕上超过了这个限制。因此，最右边的按钮缩小到其他按钮大小的一半左右。

我没有设置标题，所以 space 足以让所有 3 个按钮全尺寸显示 - 即使在 iPhone SE 上也是如此。但是，我不确定如何在代码中指定它；有什么方法可以增加此限制（或导致按钮缩小的任何功能）以确保所有 BarButtonItems 在 iPhone SE 上显示全尺寸？

Answer 1

这不是最 eloquent 的做事方式，但应该可行。

iPhone SE 屏幕的尺寸是 w:320 x h:568 Apple Screen Display Sizes

您可以调整 iPhone SE 的图像大小并执行如下操作：

var button1: UIBarButtonItem!
var button2: UIBarButtonItem!
var button2: UIBarButtonItem!

// check the screen's dimensions
if UIScreen.main.bounds.width == 320 && UIScreen.main.bounds.height == 568{

    // you may have to play around with it but resize the UIImage(named: "button1") to fit the iPhone SE
    button1 = UIBarButtonItem(image: UIImage(named: "button1_Resized"),
                              style: .plain,
                              target: self,
                              action: #selector(self.button1Tapped))

    // Repeat for button2 and button3
    // resize the UIImage(named: "button2_Resized") and UIImage(named: "button3_Resized") to fit the iPhone SE

} else{

    // anything other then the iPhone SE will get the regular sized images
    button1 = UIBarButtonItem(image: UIImage(named: "button1"),
                              style: .plain,
                              target: self,
                              action: #selector(self.button1Tapped))

    // Repeat for button2 and button3
}

navigationItem.rightBarButtonItems = [button1, button2, button3]

Answer 2

您可以声明这些属性

let contentView = UIView()
let buttonOneImageView = UIImageView()
let buttonTwoImageView = UIImageView()
let buttonThreeImageView = UIImageView()

将 UIView 分配给 titleView 属性 of navigationItem of ViewController 作为解决方法

fileprivate func buttonOneImageViewConstraints() {
    buttonOneImageView.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    buttonOneImageView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    buttonOneImageView.rightAnchor.constraint(equalTo: contentView.rightAnchor, constant: -8).isActive = true
    buttonOneImageView.widthAnchor.constraint(equalTo: buttonOneImageView.heightAnchor).isActive = true
}

fileprivate func buttonOneConstraints(_ button1: UIButton) {
    //button1 constraints
    button1.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    button1.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    button1.rightAnchor.constraint(equalTo: contentView.rightAnchor, constant: -8).isActive = true
    button1.widthAnchor.constraint(equalTo: button1.heightAnchor).isActive = true
}

fileprivate func buttonTwoImageViewConstraints() {
    buttonTwoImageView.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    buttonTwoImageView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    buttonTwoImageView.rightAnchor.constraint(equalTo: buttonOneImageView.leftAnchor, constant: -8).isActive = true
    buttonTwoImageView.widthAnchor.constraint(equalTo: buttonTwoImageView.heightAnchor).isActive = true
}

fileprivate func buttonTwoConstraints(_ button1: UIButton,_ button2: UIButton) {
    //button2 constraints
    button2.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    button2.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    button2.rightAnchor.constraint(equalTo: button1.leftAnchor, constant: -8).isActive = true
    button2.widthAnchor.constraint(equalTo: button2.heightAnchor).isActive = true
}

fileprivate func buttonThreeImageViewConstraints() {
    buttonThreeImageView.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    buttonThreeImageView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    buttonThreeImageView.rightAnchor.constraint(equalTo: buttonTwoImageView.leftAnchor, constant: -8).isActive = true
    buttonThreeImageView.widthAnchor.constraint(equalTo: buttonThreeImageView.heightAnchor).isActive = true
}

fileprivate func buttonThreeConstraints(_ button2: UIButton,_ button3: UIButton) {
    //button3 constraints
    button3.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    button3.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
    button3.rightAnchor.constraint(equalTo: button2.leftAnchor, constant: -8).isActive = true
    button3.widthAnchor.constraint(equalTo: button3.heightAnchor).isActive = true
}

fileprivate func contentViewConstraints(_ titleView: UIView) {
    //setting constraints for contentView
    contentView.rightAnchor.constraint(equalTo: titleView.rightAnchor).isActive = true
    contentView.widthAnchor.constraint(equalToConstant: UIScreen.main.bounds.width).isActive = true
    contentView.centerXAnchor.constraint(equalTo: titleView.centerXAnchor).isActive = true
    contentView.centerYAnchor.constraint(equalTo: titleView.centerYAnchor).isActive = true
    self.navigationItem.titleView = titleView
}

func setupNavBar() {

    contentView.backgroundColor = .black
    contentView.translatesAutoresizingMaskIntoConstraints = false

    let titleView = UIView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 40))
    titleView.addSubview(contentView)


    buttonOneImageView.translatesAutoresizingMaskIntoConstraints = false
    buttonOneImageView.contentMode = .scaleAspectFit
    buttonOneImageView.image = #imageLiteral(resourceName: "contacts-settings")
    contentView.addSubview(buttonOneImageView)

    //add button1
    let button1 = UIButton(type: .roundedRect)
    button1.translatesAutoresizingMaskIntoConstraints = false
    button1.addTarget(self, action: #selector(buttonOneFunction), for: .touchUpInside)
    contentView.addSubview(button1)

    buttonTwoImageView.translatesAutoresizingMaskIntoConstraints = false
    buttonTwoImageView.contentMode = .scaleAspectFit
    buttonTwoImageView.image = #imageLiteral(resourceName: "contacts-history")
    contentView.addSubview(buttonTwoImageView)

    //add button2
    let button2 = UIButton(type: .roundedRect)
    button2.translatesAutoresizingMaskIntoConstraints = false
    button2.addTarget(self, action: #selector(buttonTwoFunction), for: .touchUpInside)
    contentView.addSubview(button2)

    buttonThreeImageView.translatesAutoresizingMaskIntoConstraints = false
    buttonThreeImageView.contentMode = .scaleAspectFit
    buttonThreeImageView.image = #imageLiteral(resourceName: "contacts-person")
    contentView.addSubview(buttonThreeImageView)

    //add button3
    let button3 = UIButton(type: .roundedRect)
    button3.translatesAutoresizingMaskIntoConstraints = false
    button3.addTarget(self, action: #selector(buttonThreeFunction), for: .touchUpInside)
    contentView.addSubview(button3)


    DispatchQueue.main.asyncAfter(deadline: .now()) {
        self.buttonOneImageViewConstraints()
        self.buttonOneConstraints(button1)
        self.buttonTwoImageViewConstraints()
        self.buttonTwoConstraints(button1, button2)
        self.buttonThreeImageViewConstraints()
        self.buttonThreeConstraints(button2, button3)
        self.contentViewConstraints(titleView)
    }

}

同样，

@objc func buttonTwoFunction() {
    print("button 2 tapped")
}

@objc func buttonThreeFunction() {
    print("button 3 tapped")
}

iOS 确保条形按钮项目出现 Full-Size 在 iPhone SE 上的 UINavigationBar 中

iOS Ensure Bar Button Items Appear Full-Size in UINavigationBar on iPhone SE

ios

swift

uinavigationbar

uibarbuttonitem

iphone-se