以编程方式在具有约束的按钮上添加图像 (Swift)

Programmatically Add Image Over a Button with Constraints (Swift)

感觉好像遗漏了一些简单的东西,但我想不通。我正在尝试以编程方式在按钮上添加图像。在这种情况下,自定义按钮上有 Facebook 徽标。我希望底部位于按钮的左侧上方,因此我将图像的约束锚定在按钮的左侧。

但是,我无法对图像施加正确的约束,因为按钮的大小是可变的,具体取决于 phone 屏幕大小(宽度设置为乘数)。我认为只需将图像内容模式设置为纵横比就可以解决这个问题,但实际情况是图像的右侧是根据其完整尺寸设置的。

我该如何处理?我想也许我可以计算按钮的高度并用它来设置图像的宽度。我不确定该怎么做,而且我觉得我错过了一个更优雅的解决方案。谢谢!

let customFacebookButton = UIButton(type: .system)

let facebookLogo: UIImageView = {
    let imageView = UIImageView(image: UIImage(named: "facebookLogo"))
        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.contentMode = .scaleAspectFit
        return imageView
    }()

view.addSubview(facebookLogo)

facebookLogo.topAnchor.constraint(equalTo: customFacebookButton.topAnchor, constant: 10).isActive = true
facebookLogo.bottomAnchor.constraint(equalTo: customFacebookButton.bottomAnchor, constant: -10).isActive = true
facebookLogo.leadingAnchor.constraint(equalTo: customFacebookButton.leadingAnchor, constant: 10).isActive = true


// Custom Button Constraints in case it's helpful

customFacebookButton.topAnchor.constraint(equalTo: 
loginTextViewTitle.bottomAnchor, constant: 30).isActive = true
customFacebookButton.centerXAnchor.constraint(equalTo: view.safeAreaLayoutGuide.centerXAnchor).isActive = true
customFacebookButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
customFacebookButton.widthAnchor.constraint(equalTo: view.safeAreaLayoutGuide.widthAnchor, multiplier: 0.8).isActive = true 

您可以计算徽标的纵横比并将其与图像的高度结合使用

if let image = facebookLogo.image
{
    let ratio = image.size.width / image.size.height
    facebookLogo.widthAnchor.constraint(equalTo: facebookLogo.heightAnchor, multiplier: ratio).isActive = true
}

这样即使您调整按钮的大小,徽标的宽度也会以正确的比例调整大小