自动布局-UIButton的固有大小不包括标题插图

如果我有一个使用自动布局排列的UIButton，它的大小会很好地调整以适合其内容。

如果我将图像设置为button.image，则内在大小似乎再次说明了这一点。

但是，如果我调整titleEdgeInsets按钮的，则布局不会解决此问题，而是会截断按钮标题。

如何确保按钮的固有宽度能说明插图？

编辑：

我正在使用以下内容：

[self.backButton setTitleEdgeInsets:UIEdgeInsetsMake(0, 5, 0, 0)];

目的是在图像和文本之间添加一些分隔。

您可以解决此问题，而不必覆盖任何方法或设置任意宽度约束。您可以按照以下步骤在Interface Builder中完成所有操作。

• 本质按钮的宽度是从标题宽度加上图标宽度加上左右内容边缘插图得出的。

• 如果按钮同时具有图像和文本，则它们将作为一个组居中，并且之间没有填充。

• 如果添加左内容插图，则它是相对于文本而不是文本+图标计算的。

• 如果将负图像插入设置为负，则图像会向左拉出，但按钮的整体宽度不会受到影响。

• 如果将负图像插入设置为负，则实际布局将使用该值的一半。因此，要获得-20点的左插入，必须在Interface Builder中使用一个-40点的左插入值。

因此，您需要提供足够大的左侧内容插图，以为所需的左侧插图创建空间 和图标与文本之间的内部填充，然后通过将图标和文本之间所需的填充量加倍来向左移动图标。结果是一个具有相等的左右内容插入量的按钮，以及一个以组为中心的文本和图标对，它们之间具有特定的填充量。

一些示例值：

// Produces a button with the layout:
// |-20-icon-10-text-20-|
// AutoLayout intrinsic width works as you'd desire.
button.contentEdgeInsets = UIEdgeInsetsMake(10, 30, 10, 20)
button.imageEdgeInsets = UIEdgeInsetsMake(0, -20, 0, 0)

通过组合使用负的和正的标题和内容插图，可以使它在Interface Builder中工作（无需编写任何代码）。

更新：Xcode 7有一个错误，您不能在“ Right插入”字段中输入负值，但是可以使用它旁边的步进控件来减小该值。（感谢Stuart）

这样做将在图像和标题之间增加8pt的间距，并将按钮的固有宽度增加相同的数量。像这样：

为什么不重写intrinsicContentSizeUIView上的方法？例如：

- (CGSize) intrinsicContentSize
{
    CGSize s = [super intrinsicContentSize];

    return CGSizeMake(s.width + self.titleEdgeInsets.left + self.titleEdgeInsets.right,
                      s.height + self.titleEdgeInsets.top + self.titleEdgeInsets.bottom);
}

这应该告诉自动布局系统它应该增加按钮的大小以允许插入并显示全文。我不在自己的电脑上，因此尚未进行测试。

您尚未指定如何设置插图，所以我猜您正在使用titleEdgeInsets，因为我看到的效果与以前相同。如果我使用contentEdgeInsets，它将正常工作。

- (IBAction)ChangeTitle:(UIButton *)sender {
    self.button.contentEdgeInsets = UIEdgeInsetsMake(0,20,0,20);
    [self.button setTitle:@"Long Long Title" forState:UIControlStateNormal];
}

对于Swift来说，这是这样的：

extension UIButton {
    override open var intrinsicContentSize: CGSize {
        let intrinsicContentSize = super.intrinsicContentSize

        let adjustedWidth = intrinsicContentSize.width + titleEdgeInsets.left + titleEdgeInsets.right
        let adjustedHeight = intrinsicContentSize.height + titleEdgeInsets.top + titleEdgeInsets.bottom

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

爱你迅捷

这个线程有点旧，但是我自己碰到了这个问题，并且可以通过使用负数插入来解决它。例如，在此处替换所需的填充值：

UIButton* myButton = [[UIButton alloc] init];
// setup some autolayout constraints here
myButton.titleEdgeInsets = UIEdgeInsetsMake(-desiredBottomPadding,
                                            -desiredRightPadding,
                                            -desiredTopPadding,
                                            -desiredLeftPadding);

结合正确的自动布局约束，您最终将获得一个自动调整大小的按钮，其中包含图像和文本！如下所示，desiredLeftPadding设置为10。

您可以看到按钮的实际框架不包含标签（因为标签在边界之外向右移动了10点），但是我们在文本和图片之间实现了10点的填充。

对于基于pegpeg的答案的Swift 3：

extension UIButton {

    override open var intrinsicContentSize: CGSize {

        let intrinsicContentSize = super.intrinsicContentSize

        let adjustedWidth = intrinsicContentSize.width + titleEdgeInsets.left + titleEdgeInsets.right
        let adjustedHeight = intrinsicContentSize.height + titleEdgeInsets.top + titleEdgeInsets.bottom

        return CGSize(width: adjustedWidth, height: adjustedHeight)

    }

}

以上所有内容均不适用于iOS 9+，我所做的是：

• 添加宽度限制（当按钮没有任何文本时为最小宽度。如果提供了文本，则按钮将自动缩放）
• 将关系设置为大于或等于

现在只需在方法周围添加边框即可：

button.contentEdgeInsets = UIEdgeInsetsMake(0,20,0,20);

我想在UIButton图标和标签之间添加5pt的空间。这是我实现的方式：

UIButton *infoButton = [UIButton buttonWithType:UIButtonTypeCustom];
// more button config etc
infoButton.contentEdgeInsets = UIEdgeInsetsMake(0, 0, 0, 5);
infoButton.titleEdgeInsets = UIEdgeInsetsMake(0, 5, 0, -5);

contentEdgeInsets，titleEdgeInsets和imageEdgeInsets相互关联的方式要求每个插图都有一些让步。因此，如果在标题的左侧添加一些插图，则必须在右侧添加负插图，并在内容右侧提供更多空间（通过正插图）。

通过添加正确的内容插图以匹配标题插图的偏移，我的文本不会超出按钮的范围。

该选项在界面生成器中也可用。参见插图。我将左右设置为3。工作就像一种魅力。

我使用的解决方案是在按钮上添加宽度约束。然后在初始化的某个地方，设置完文本后，像下面这样更新宽度约束：

self.buttonWidthConstraint.constant = self.shareButton.intrinsicContentSize.width + 8;

8是您的插图。

调用sizeToFit（）确保contentEdgeInset生效

extension UIButton {

   open override func draw(_ rect: CGRect) { 
       self.contentEdgeInsets = UIEdgeInsets(top: 10, left: 40, bottom: 10, right: 40)
       self.sizeToFit()
   }
}