带图像的按钮和底部的标签

Question

我想制作一个按钮，底部有一个图标和一个标签，如下所示：

最好的方法是什么？是否可以将图像视图对象和标签拖到按钮中？

Answer 1

清理了@Shahzaib Maqbool的答案。我最初发生了一些崩溃，通过移除了展开力来修复了那些崩溃。在Swift 5上进行了测试。

extension UIButton {
    func alignTextBelow(spacing: CGFloat = 6.0) {
        guard let image = self.imageView?.image else {
            return
        }

        guard let titleLabel = self.titleLabel else {
            return
        }

        guard let titleText = titleLabel.text else {
            return
        }

        let titleSize = titleText.size(withAttributes: [
            NSAttributedString.Key.font: titleLabel.font
        ])

        titleEdgeInsets = UIEdgeInsets(top: spacing, left: -image.size.width, bottom: -image.size.height, right: 0)
        imageEdgeInsets = UIEdgeInsets(top: -(titleSize.height + spacing), left: 0, bottom: 0, right: -titleSize.width)
    }
}

Answer 2

UIButton 有两个您可能感兴趣的属性。它们是 titleEdgeInsets 和 imageEdgeInsets 。

  

使用此属性调整大小并重新定位按钮标题的有效绘图矩形。您可以为四个插图（顶部，左侧，底部，右侧）中的每一个指定不同的值。正值会缩小或缩小，使其靠近按钮的中心。负值会扩展或偏离该边缘

您可以使用这些来获得所需的布局。

Answer 3

通过代码，您可以像使用Swift 4.2兼容的代码一样在此处进行操作，只需调用函数即可

  public extension UIButton
  {

    func alignTextBelow(spacing: CGFloat = 6.0)
    {
        if let image = self.imageView?.image
        {
            let imageSize: CGSize = image.size
            self.titleEdgeInsets = UIEdgeInsets(top: spacing, left: -imageSize.width, bottom: -(imageSize.height), right: 0.0)
            let labelString = NSString(string: self.titleLabel!.text!)
            let titleSize = labelString.size(withAttributes: [NSAttributedString.Key.font: self.titleLabel!.font])
            self.imageEdgeInsets = UIEdgeInsets(top: -(titleSize.height + spacing), left: 0.0, bottom: 0.0, right: -titleSize.width)
        }
    }
}