我们如何在UINavigation中添加额外的UILabels？

Question

我想为UINavigation添加一个循环视图和一个标签。像这样：

我可以通过以下代码为我的UINavigation设置标签：

    if let navigationBar = self.navigationController?.navigationBar {
        let firstFrame = CGRect(x: 300, y: 0, width: navigationBar.frame.width/2, height: navigationBar.frame.height)
        let firstLabel = UILabel(frame: firstFrame)
        firstLabel.text = "First"

        navigationBar.addSubview(firstLabel)

    }

但是这段代码有两个问题： 1.如何正确设置x位置？ （测试我设置300值，但此值显示不同屏幕尺寸的不同位置） 2.如何设置此标签的循环背景？

Answer 1

您可以以编程方式将视图（红色圆圈）和标签（编号16）作为子视图添加到小节按钮项目的按钮。

你应该做的是：

• 将按钮作为IBOutlet连接到其ViewController：

确保所连接的组件是UIButton，但不是UIBarButtonItem。

如您所见，我称之为btnMenu。

• 创建视图（红色圆圈和数字标签）并将其添加到btnMenu：

它应该类似于：

import UIKit

class ViewController: UIViewController {
    //...

    @IBOutlet weak var btnMenu: UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()

        //...

        // setup the red circle UIView
        let redCircleView = UIView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
        redCircleView.backgroundColor = UIColor.red
        redCircleView.layer.cornerRadius = view.frame.size.width / 2

        // setup the number UILabel
        let label = UILabel(frame: CGRect(x: 4, y: 0, width: 20, height: 20))
        label.textColor = UIColor.white
        label.font = UIFont.systemFont(ofSize: 10)
        label.text = "16"

        // adding the label into the red circle
        redCircleView.addSubview(label)

        // adding the red circle into the menu button
        btnMenu.addSubview(redCircleView)

        //...
    }

    //...
}

那就是它！

UIButton是UIView的子类，这意味着可以向其添加子视图（add​Subview(_:​)）。

<强>输出：

希望这会有所帮助。