如何在 Swift 中为 UIButton 设置 Title Padding (Inset)

Question

我是一名初学者 iOS 程序员并尝试开发 iOS 应用程序。我有几个按钮放在应用程序的主页上，如图所示。

请看红圈。图像和标题之间没有空格（填充/插入）。

实际上，我已经使用此代码设置了图像和标题插图。但是，它并没有给出任何不同的结果。

    buttonDoctor.titleLabel?.numberOfLines = 2
    buttonDoctor.titleLabel?.lineBreakMode = .byWordWrapping
    buttonMedical.titleLabel?.numberOfLines = 2
    buttonMedical.titleLabel?.lineBreakMode = .byWordWrapping
    buttonQuestion.titleLabel?.numberOfLines = 2
    buttonQuestion.titleLabel?.lineBreakMode = .byWordWrapping
    buttonLocation.titleLabel?.numberOfLines = 2
    buttonLocation.titleLabel?.lineBreakMode = .byWordWrapping
    buttonPromotion.titleLabel?.numberOfLines = 2
    buttonPromotion.titleLabel?.lineBreakMode = .byWordWrapping
    buttonDoctor.image(for: .normal)
    buttonMedical.image(for: .normal)
    buttonQuestion.image(for: .normal)
    buttonLocation.image(for: .normal)
    buttonPromotion.image(for: .normal)
    //buttonDoctor.titleLabel?.adjustsFontSizeToFitWidth = true
    //buttonPromotion.titleLabel?.adjustsFontSizeToFitWidth = true
    //buttonLocation.titleLabel?.adjustsFontSizeToFitWidth = true
    //buttonQuestion.titleLabel?.adjustsFontSizeToFitWidth = true
    //buttonMedical.titleLabel?.adjustsFontSizeToFitWidth = true



    let btnimg = try? UIImage(named: "doctorschedule.png")
    var newimg = imageResize(image: btnimg!!, scaledTo: CGSize(width: 36, height: 36))
    buttonDoctor.setImage(newimg, for: .normal)
    buttonDoctor.contentMode = .scaleAspectFit
    buttonDoctor.imageEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 5)
    buttonDoctor.titleEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 0)

    let btnimg2 = try? UIImage(named: "medicalcheck.png")
    var newimg2 = imageResize(image: btnimg2!!, scaledTo: CGSize(width: 36, height: 36))
    buttonMedical.setImage(newimg2, for: .normal)
    buttonMedical.contentMode = .scaleAspectFit
    buttonMedical.imageEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 5)
    buttonMedical.titleEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 0)

    let btnimg3 = try? UIImage(named: "survey.png")
    var newimg3 = imageResize(image: btnimg3!!, scaledTo: CGSize(width: 36, height: 36))
    buttonQuestion.setImage(newimg3, for: .normal)
    buttonQuestion.contentMode = .scaleAspectFit
    buttonQuestion.imageEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 5)
    buttonQuestion.titleEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 0)

    let btnimg4 = try? UIImage(named: "location.png")
    var newimg4 = imageResize(image: btnimg4!!, scaledTo: CGSize(width: 36, height: 36))
    buttonLocation.setImage(newimg4, for: .normal)
    buttonLocation.contentMode = .scaleAspectFit
    buttonLocation.imageEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 5)
    buttonLocation.titleEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 0)

    let btnimg5 = try? UIImage(named: "promotion.png")
    var newimg5 = imageResize(image: btnimg5!!, scaledTo: CGSize(width: 36, height: 36))
    buttonPromotion.setImage(newimg5, for: .normal)
    buttonPromotion.contentMode = .scaleAspectFit
    buttonPromotion.imageEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 5)
    buttonPromotion.titleEdgeInsets = UIEdgeInsetsMake(5, 3, 0, 0)

我已经为插图尝试了几个值，但没有给出不同的结果。我的代码有什么问题吗？

请有人帮我解决这个问题。谢谢

注意：我还有一个问题。我想在首页顶部放一个图像标志（见橙色圆圈），但我不知道该怎么做。由于没有在导航栏中插入图像的属性。 仅供参考，这只是我从情节提要中放入的UIViewController 内的常规导航栏（不是UINavigationController）。如果您不介意，请就此提出一些建议。

注意：圆圈中的所有内容都只是一个普通的 UIBUTTON，而不是 UIImage 和 UILabel 或 UIbutton。请看我的代码。

Answer 1

将左右两边的约束设置为 0，文本将居中。

Answer 2

解决方案： 作为查询的解决方案，仅将左插图设置为 10 作为标题。将其他插图保持为 0（或您要设置的任何内容）

注意：

• “内容插入”适用于标题和图片。
• “标题插入”仅适用于标题文本/字符串。
• “图片插图”仅适用于图片/图标。

试试这个（使用 Xcode 9+）：

从故事板（Interface Builder）设计中，您可以使用 UIButton 的属性设置 inset，如此快照所示。

Answer 3

对于程序化解决方案，您正在使用：

dismissButton.titleEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 0, right: 10)

什么时候应该使用：

someButton.contentEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 0, right: 10)

这是因为标题边缘插入（按设计）在调整文本大小后插入。

编辑：（iOS 15+） 正如@SuryaKantSharma 评论的那样，这已被弃用。

配置按钮的新方法包括控制填充和插入的三个选项。

• titlePadding：标题和副标题标签之间的距离。
• imagePadding：按钮图片与文字的距离
• contentInsets：按钮内容区域到它的距离 界限。

有关UIButton.Configuration 的示例和说明，请查看此链接：

这是 Sarun 关于使用 UIButton (UIKit) 的三篇文章中的第一篇。它们值得一读！

https://sarunw.com/posts/new-way-to-style-uibutton-in-ios15/