• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

ios - 如何使用自动布局以动态高度居中 View

[复制链接]
菜鸟教程小白 发表于 2022-12-11 18:40:46 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

我正在尝试以编程方式创建一个以指定 super View 为中心的 View 。我几乎可以实现这种行为,但是居中 View 不尊重其内容的动态高度。这是我为实现它而创建的函数:

static func overlayWithButton(onView view: UIView, buttonText: String, theme: Theme = .dark, action: Action? = nil) -> UIView {
    // create overlay
    let overlay = UIView()
    overlay.translatesAutoresizingMaskIntoConstraints = false
    let leftInset: CGFloat = 20
    let rightInset: CGFloat = 20

    // Style overlay
    overlay.backgroundColor = theme == .dark ? UIColor.black : UIColor.white
    overlay.alpha = 0.75
    overlay.cornerRadius = 10

    // create button
    let button = UIButton(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
    button.translatesAutoresizingMaskIntoConstraints = false

    // Style Button
    button.backgroundColor = UIColor.clear
    button.setTitle(buttonText, for: .normal)
    button.setTitleColor(theme == .dark ? lightBlueButtonText : UIColor.black, for: .normal)
    button.titleLabel?.lineBreakMode = .byWordWrapping
    button.titleLabel?.textAlignment = .center
    button.titleLabel?.numberOfLines = 0
    button.titleLabel?.font = UIFont.boldSystemFont(ofSize: 20)
    button.isEnabled = true

    // add button action
    if let action = action {
        button.add(for: .touchUpInside, action)
    }

    // add constraints
    overlay.addSubview(button)
    button.centerXAnchor.constraint(equalTo: overlay.centerXAnchor).isActive = true
    button.leftAnchor.constraint(greaterThanOrEqualTo: overlay.leftAnchor).isActive = true
    button.rightAnchor.constraint(lessThanOrEqualTo: overlay.rightAnchor).isActive = true

    button.topAnchor.constraint(equalTo: overlay.topAnchor).isActive = true
    button.bottomAnchor.constraint(equalTo: overlay.bottomAnchor).isActive = true

    view.addSubview(overlay)
    overlay.leftAnchor.constraint(equalTo: view.leftAnchor, constant: leftInset).isActive = true
    overlay.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -rightInset).isActive = true
    overlay.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true

    return overlay
}

这适用于短按钮标题: it works! 但是,对于较长的标题,按钮内容会被剪裁: enter image description here 使用显示我可以看到标题/按钮标签按预期响应。 it does not work 我已经有一段时间了,我无法让居中的叠加层扩展其高度以匹配其内容的内在内容大小。有什么想法吗?



Best Answer-推荐答案


经过大量挖掘,发现问题出在 UIButton 与其标签之间的奇怪交互。有关该特定问题的更多详细信息,请参阅 this stack overflow post。虽然投票最多的解决方案都没有成功帮助我解决问题,但 a solution further down 确实有帮助。解决方案在于创建一个覆盖intrinsicContentSize 和layoutSubviews 的UIButton 子类。此类子类的代码在这里:

class LongTitleButton: UIButton {

    override var intrinsicContentSize: CGSize {
        return self.titleLabel?.intrinsicContentSize ?? super.intrinsicContentSize
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        if let titleLabel = titleLabel {
            titleLabel.preferredMaxLayoutWidth = titleLabel.frame.size.width
        }
    }

}

另外,由于这个问题似乎特定于 UIButton,因此同样有效的替代解决方案是简单地使用 UILabel 而不是 UIButton,而是在标签上放置一个 UIGestureRecognizer。

关于ios - 如何使用自动布局以动态高度居中 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46206302/

回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注0

粉丝2

帖子830918

发布主题
阅读排行 更多
广告位

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap