Ios 如何对齐UIImage下面的UIButton中的文本，因为它没有正确显示

我的导航出现问题，按钮显示不正确。我想要两排，每排3个按钮。每个按钮都有一个图像和一个标签。标签应位于图像的中心和下方。但这是一件棘手的事情，我似乎无法正常工作，因为每次我启动模拟器时，第一个按钮看起来都很好，其他所有按钮都正确显示在图像中，而不是标签中。我试图弄乱按钮的大小，但似乎没有任何效果

我也试着使用stackoverflow上的代码，但我没有正确地工作。因为根本没有显示图像，但大小是正确的。此外，标签仅显示在第一个按钮上

我正在使用一个

IBDesignable

来扩展

UIButton

类，我将该类分配给

按钮

s

import UIKit

@IBDesignable
class VerticalButton: UIButton {

    @IBInspectable public var padding: CGFloat = 20.0 {
        didSet {
            setNeedsLayout()
        }
    }

    override var intrinsicContentSize: CGSize {
        let maxSize = CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)

        if let titleSize = titleLabel?.sizeThatFits(maxSize), let imageSize = imageView?.sizeThatFits(maxSize) {
            let width = ceil(max(imageSize.width, titleSize.width))
            let height = ceil(imageSize.height + titleSize.height + padding)

            return CGSize(width: width, height: height)
        }

        return super.intrinsicContentSize
    }

    override func layoutSubviews() {
        if let image = imageView?.image, let title = titleLabel?.attributedText {
            let imageSize = image.size
            let titleSize = title.size()

            titleEdgeInsets = UIEdgeInsets(top: 0.0, left: -imageSize.width, bottom: -(imageSize.height + padding), right: 0.0)
            imageEdgeInsets = UIEdgeInsets(top: -(titleSize.height + padding), left: 0.0, bottom: 0.0, right: -titleSize.width)
        }

        super.layoutSubviews()
    }

}

我猜我在计算按钮的

intrinsicContentSize

时出错了。 我还仔细检查了这个类是否分配给了所有相关的按钮，并且每个按钮都有一个标签。除此之外，我还检查了没有通过interface builder设置插入

到目前为止，我还没有找到解决办法，因此我提出了这个问题。我感谢你的帮助。如果您需要更多信息，请随时联系。我很乐意提供

---

感谢@DonMag的帮助，我发现问题不在于代码，而在于图像的大小

感谢@DonMag的帮助，我发现问题不在于代码，而在于图像的大小

你的图片大小都一样吗？在一个快速测试中，您的代码似乎运行良好：。。。（水平堆栈视图中有2组3个按钮-我在第二行使用了相同的图像，带有不同的标签）。@DonMagi会检查它。你是否在按钮上使用了堆栈视图或任何约束？只有嵌入在垂直堆栈视图中的两个水平堆栈视图。以下是故事板源的来源（您需要更新图像名称）：您的图像大小是否相同？在一个快速测试中，您的代码似乎运行良好：。。。（水平堆栈视图中有2组3个按钮-我在第二行使用了相同的图像，带有不同的标签）。@DonMagi会检查它。你是否在按钮上使用了堆栈视图或任何约束？只有嵌入在垂直堆栈视图中的两个水平堆栈视图。以下是故事板源的来源（您需要更新图像名称）：