使用比例约束会导致不同屏幕尺寸出现故障

Posted 2023-03-12

【中文标题】使用比例约束会导致不同屏幕尺寸出现故障

【英文标题】：Using proportional constraints results in glitches on different screen sizes

【发布时间】：2017-11-10 17:03:05

【问题描述】：

我在处理一个更大的项目时遇到了这个问题，但我已经简化了它来演示这个问题。

我的视图控制器中有一个 UIView，它是方形且居中的：

现在，“比例高度”在这里很重要，因为如果将高度或宽度设置为常数，则不会出现问题：

我希望这个视图在手机上显示为一个漂亮的圆圈，所以我从它添加一个出口到 ViewController.swift 并将cornerRadius 提供给视图的layer：

class ViewController: UIViewController 

    @IBOutlet weak var centerView: UIView!

    override func viewDidLoad() 
        super.viewDidLoad()
        centerView.layer.cornerRadius = centerView.frame.width / 2
    

当我在 Storyboard 中将“查看为”设置为 iPhone SE 并在 iPhone SE 模拟器上启动应用程序时，我得到了预期的结果：

但如果我不更改 Storyboard 中的“查看方式”并在 iPhone 6 Plus 模拟器上启动，我会得到以下结果：

当我将 Storyboard 切换到相应的屏幕时，它又恢复了正常：

我希望这只是一个模拟器错误，但在物理设备上启动时会出现同样的问题。因此，在部署应用程序时，用户可能会因为我在开发时为 Storyboard 选择的屏幕而弄乱 UI？

更新。我应该注意，将 layoutIfNeeded() 添加到 ViewController 文件可以解决问题：

override func viewDidLoad() 
    super.viewDidLoad()
    view.layoutIfNeeded()
    centerView.layer.cornerRadius = centerView.frame.width / 2

但是无论在哪种屏幕尺寸上，应用启动时不应该强制布局吗？

【问题讨论】：

将centerView.layer.cornerRadius = centerView.frame.width / 2 移动到viewDidLayoutSubviews。在viewDidLoad 中，视图的大小将是它在情节提要或xib 中的大小。 viewDidLayoutSubviews 在视图框架更新后调用。

【参考方案1】：

视图可以经常更改大小。如果您在viewDidLoad() 中设置.cornerRadius，则视图更改时不会反映。

将UIView 子类化会更好：

class RoundedView: UIView 
    override func layoutSubviews() 
        self.layer.cornerRadius = self.bounds.size.height / 2.0
    

而且，您可以轻松地将其设置为“可设计”，以便在您的故事板中进行布局时看到“圆形视图”：

@IBDesignable
class RoundedView: UIView 
    override func layoutSubviews() 
        self.layer.cornerRadius = self.bounds.size.height / 2.0