【问题标题】:UI Button image replaces the title. But I want BOTH the text and image and title to showUI 按钮图像替换标题。但我希望同时显示文本、图像和标题
【发布时间】:2019-07-24 04:22:12
【问题描述】:

我正在尝试使用“使用 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。我无法将文本直接放在图标旁边。

【问题讨论】:

  • 您只需要一个更大的按钮。如果有空间,文本和图像都会显示。
  • 我只是得到一个看起来更大的按钮。我仍然有这个问题。
  • 我认为 facebook 在图像上使用文本和徽标,您应该创建带有文本和所需徽标的图像并在按钮上使用该图像
  • 我向你保证,带有图像和标题的按钮很常见。
  • @matt 你是对的,我大部分时间都在使用它们,在她的情况下,我认为按钮她需要一个带有徽标和标题的图像,然后在按钮上使用该图像。你说什么?

标签: ios swift uibutton


【解决方案1】:

您可以通过以下方式找到解决问题的方法

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

【讨论】:

  • #4 就是答案!!!你太棒了,谢谢你的帮助。我尝试了一个不同的 facebook 图标,果然成功了。
  • 虽然现在我在 facebook 徽标和我的标题之间有了很大的空间。我怎样才能让它们直接相邻而没有空间?
  • 自定义按钮需要设置一些属性。
  • 你可以使用左边的图片插入或者你可以使用右边的标题插入甚至你可以同时使用图片插入和标题插入来将内容保持在中间。
  • 如果答案 #4 解决了问题,您应该接受答案,因为它将帮助其他人找到解决问题的正确方法:)
【解决方案2】:

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 pod 来获取 Facebook 图片

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-01-24
    • 2019-08-26
    • 2010-09-24
    • 1970-01-01
    • 1970-01-01
    • 2016-09-22
    • 1970-01-01
    • 2018-03-13
    相关资源
    最近更新 更多