让按钮在宽度和高度上增长以适应标题文本

Posted

技术标签:

【中文标题】让按钮在宽度和高度上增长以适应标题文本【英文标题】:Let button grow in width and height to fit title text 【发布时间】:2016-01-12 18:10:39 【问题描述】:

我有一个带有可变 titleLabel 文本的 UIButton。我想要完成的(使用自动布局)是按钮会增长以适应标题,即使标题需要多于一行。所以它必须首先增加宽度,当宽度达到极限时,它必须增加高度以适应标题。如下图场景C:

首先:我完成了我的目标。感谢this 和another 发布后,我将 UIButton 子类化,现在该按钮可以按我的意愿工作。这是我的 UIButton 代码:

class JvBstretchableButton: UIButton 

    required init?(coder aDecoder: NSCoder) 
        super.init(coder: aDecoder)

        self.titleLabel?.numberOfLines = 0
        self.titleLabel?.lineBreakMode = .ByWordWrapping
    

    override func intrinsicContentSize() -> CGSize 

        return (self.titleLabel?.intrinsicContentSize())!
    

    override func layoutSubviews() 

        super.layoutSubviews()

          /*
    Set the preferredMaxLayoutWidth of the titleLabel to the width of the superview minus 
two times the known constant value for the leading and trailing button constraints 
(which is 10 each). I'm looking for another way to do this. I shouldn't have to hardcode 
this right? Autolayout knows the width of the surrounding view and all the relevant  constraint 
constants. So it should be able to figure out the preferredMaxLayoutWidth itself.
        */

        self.titleLabel?.preferredMaxLayoutWidth = superview!.frame.width - 20
        super.layoutSubviews()
    

但是,我有一种强烈的感觉,我错过了一些东西,并且必须有更简单的方法来做到这一点。这让我想到了我的问题:

A) 真的需要 UIButton 子类,还是有其他更简单的方法?

B) 如果我们不能阻止 UIButton 的子类化:有没有办法让 AutoLayout 计算出按钮的最大宽度是多少?我现在必须手动传递超级视图的框架并“硬编码”按钮约束的常量。

【问题讨论】:

【参考方案1】:

您可以使用(多行)UILabel 和 UIButton 并且不进行子类化来获得该结果。将您的 UILabel 配置为多行(即 0 行)并将所有按钮边缘与 UILabel 的边缘对齐。 UILabel 将根据内容调整大小,按钮将跟随。然后,您可以使用 UILabel 作为按钮的文本,或者将其放在按钮下方并以编程方式复制按钮的文本。

【讨论】:

谢谢!这有点骇人听闻,但是您的解决方案有效。除此之外,更容易获得正确的内容插图。将标签放在按钮后面,将按钮连接到具有等于所需插图的约束的标签。随后,将相同的边缘插图添加到按钮本身,并确保按钮文本和“按钮后面的标签”文本具有相同的字体(大小)。哦,当然,将按钮标题本身设置为多行。 感谢您的洞察力。我很好奇为什么按钮不随标题行增长,但就这样吧。这让我走上了正轨。

以上是关于让按钮在宽度和高度上增长以适应标题文本的主要内容,如果未能解决你的问题,请参考以下文章

有啥办法可以让按钮上的图像自动调整大小以适应屏幕?

怎样让iframe中的内容的宽度和高度改变后,dialog的宽高自适应?

怎么让iframe自适应浏览器的高度和宽度

为啥我不能让按钮的高度等于它们的宽度? [复制]

iframe自适应高度设置(iframe自适应高度和宽度)

在android中裁剪图像以适应宽度和截断高度