ios - 如何在矩形（UIButton或UIControl）Swift iOS中绘制多个水平圆

Question

如何在水平区域中绘制大约三个圆形，矩形中的主色和环色。我需要用这个圆圈创建自定义按钮，如下所示：

有什么好的方法可以做到这一点吗？

标签： iosswiftcustom-button

Answer 1

我们可以很轻松地设计出这样的视图UIStackView。取一个 stackView，将其设置alignment为center、axis和。创建一个或偶数并为其添加圆角半径和边框。最后，将这些视图添加到主 stackView。试试这个。horizontaldistributionfillUILabel/UIButton/UIImageViewUIView

override func viewDidLoad() {
    super.viewDidLoad()

    //Setup stackView
    let myStackView = UIStackView()
    myStackView.axis = .horizontal
    myStackView.alignment = .center
    myStackView.distribution = .fillEqually
    myStackView.spacing = 8
    view.addSubview(myStackView)

    //Setup circles
    let circle_1 = circleLabel()
    let circle_2 = circleLabel()
    let circle_3 = circleLabel()

    myStackView.addArrangedSubview(circle_1)
    myStackView.addArrangedSubview(circle_2)
    myStackView.addArrangedSubview(circle_3)

    myStackView.translatesAutoresizingMaskIntoConstraints = false
    myStackView.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 0.0).isActive = true
    myStackView.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 0.0).isActive = true
}

func circleLabel() -> UILabel {

    let label = UILabel()
    label.backgroundColor = UIColor.red
    label.layer.cornerRadius = 12.5
    label.layer.masksToBounds = true
    label.layer.borderColor = UIColor.orange.cgColor
    label.layer.borderWidth = 3.0

    label.widthAnchor.constraint(equalToConstant: 25.0).isActive = true
    label.heightAnchor.constraint(equalToConstant: 25.0).isActive = true

    return label
}