UI按钮图像替换标题。但我要同时显示文字，图片和标题

Question

我正在尝试使用“使用Facebook登录”按钮，该按钮的文字左侧带有Facebook图标。但是当我使用signInFacebookButton.setImage .....时，文本消失，只有徽标直接出现在按钮的中心。看起来图像已覆盖文字。有人可以帮助我解决此问题，以便我的按钮同时显示按钮上的图标和文本，如该图片所示

我已经尝试使用背景图片代替。但是背景图片会填满整个按钮，并在其上覆盖文字。

signInFacebookButton.setTitle("Sign in with Facebook", for: .normal)
signInFacebookButton.titleLabel?.font = UIFont.systemFont(ofSize: 18)
signInFacebookButton.backgroundColor = UIColor(red: 58/255, green: 85/255, blue: 159/255, alpha: 1)

signInFacebookButton.layer.cornerRadius = 5
signInFacebookButton.clipsToBounds = true
signInFacebookButton.setImage(UIImage(named: "facebook"), for: .normal)
signInFacebookButton.imageView?.contentMode = .scaleAspectFit

更新： 现在我的按钮看起来像this。我无法使文字直接位于图标旁边。

Answer 1

signInFacebookButton.setTitle("Sign in with Facebook", for: .normal)
signInFacebookButton.titleLabel?.font = UIFont.systemFont(ofSize: 18)
signInFacebookButton.backgroundColor = UIColor(red: 58/255, green: 85/255, blue: 159/255, alpha: 1)

signInFacebookButton.layer.cornerRadius = 5
signInFacebookButton.clipsToBounds = true
let facebookImage = UIImage.fontAwesomeIcon(name: .facebookSquare, style: .brands, textColor: .white, size: CGSize(width: 30, height: 30))
signInFacebookButton.setImage(facebookImage, for: .normal)
signInFacebookButton.imageView?.contentMode = .scaleAspectFit

我正在将fontAwesome吊舱用于Facebook图片

Answer 2

您可以通过执行

来找到解决问题的方法

1. 检查背景颜色和标题颜色是否不同
2. 将状态配置更改为默认
3. 设置图像中显示的插图可根据需要设置值。
4. 检查您的facebook图像是否较大，然后需要尝试减小图像尺寸。