图像视图的纵横比在 iPad 和 iPhone 上不一样答案

【问题标题】：Aspect ratio of image view is not the same on iPad as on iPhones图像视图的纵横比在 iPad 和 iPhone 上不一样
【发布时间】：2020-02-28 23:16:08
【问题描述】：

我正在尝试制作 Connect Four 游戏，一切正常，除了我的棋盘在 iPad 上和 iPhone 上的纵横比不同，我似乎无法找出问题所在。这给我带来了问题，因为我依靠纵横比来计算碎片的位置，因为我将它们放到板上。

我做了一个基本的问题例子，代码如下

override func viewDidLoad() {
    super.viewDidLoad()

    let guide = view.safeAreaLayoutGuide

    let bottomView = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
    bottomView.backgroundColor = .red
    bottomView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(bottomView)
    NSLayoutConstraint.activate([
        bottomView.bottomAnchor.constraint(equalTo: guide.bottomAnchor),
        bottomView.leadingAnchor.constraint(equalTo: guide.leadingAnchor),
        bottomView.trailingAnchor.constraint(equalTo: guide.trailingAnchor),
        bottomView.heightAnchor.constraint(equalToConstant: 120)
    ])

    let image = UIImage(named: "Frontground")
    imageView = UIImageView(image: image)
    imageView.translatesAutoresizingMaskIntoConstraints = false

    view.addSubview(imageView)

    NSLayoutConstraint.activate([
        imageView.trailingAnchor.constraint(equalTo: guide.trailingAnchor),
        imageView.leadingAnchor.constraint(equalTo: guide.leadingAnchor),
        imageView.heightAnchor.constraint(equalTo: imageView.widthAnchor, multiplier: 329/389),
        imageView.bottomAnchor.constraint(equalTo: bottomView.topAnchor, constant: -32)
    ])
}

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    let desiredAspectRatio = CGFloat(CGFloat(389)/CGFloat(329))
    let actualAspectRatio = imageView.frame.size.width/imageView.frame.size.height

    print("Desired Aspect Ratio is \(desiredAspectRatio), actual Aspect ratio is \(actualAspectRatio)")
}

我使用的图像宽度为 389，高度为 329，我想在所有设备上保持这种关系。

iPad 上的纵横比并没有那么遥远，但它足以让部件最终无法精确地安装在孔中。尽管我的纵横比不精确，但在 iPhone 版本上一切正常，也许是因为屏幕较小，问题并不那么明显。

这是我使用的图像的示例。

当我在 iPhone 上运行时，我得到：所需纵横比为 1.182370820668693，实际纵横比为 1.1828571428571428

当我在 iPad 上跑步时，我得到：所需纵横比为 1.182370820668693，实际纵横比为 1.1824817518248176

我是否可以得到我想要的确切纵横比？

对于此事的任何帮助将不胜感激。

谢谢，艾伦

【问题讨论】：

您在运行此程序时是否看到任何 NSLayoutConstraint 错误？此外，您可能想在定义常量时尝试转换 329/389。以避免任何隐式类型转换问题。您也可以输入CGFloat(0.8457583547557841) 作为常量，以排除那里的问题。
既然是用纵横比做计算，何不直接接受真实纵横比进行计算？

标签： ios swift uiimageview aspect-ratio

【解决方案1】：

请记住，UIKit 不能在部分像素上绘图。

使用您在各种设备上的约束，宽度将是整数，但计算出的高度不会......因此自动布局会调整。

在这些设备上我们得到：

Ratio: 329.0 / 389.0 = 0.8457583547557841

iPad Pro 12.9
actual w: 1024.0 * 0.8457583547557841 = 866.0565552699229 ... but actual h: 866.0

iPad Pro 9.7
actual w:  768.0 * 0.8457583547557841 = 649.5424164524422 ... but actual h: 649.5

iPhone 8
actual w:  375.0 * 0.8457583547557841 = 317.15938303341903 ... but actual h: 317.0

iPhone 11
actual w:  414.0 * 0.8457583547557841 = 350.14395886889463 ... but actual h: 350.0

所以您在不同尺寸上的实际长宽比将不完全相同。

要获得像素完美的对齐，您需要考虑到这一点。

另请注意，Points 不等于 Pixels。在2x 屏幕缩放设备上，帧值可以四舍五入到1/2 点，因此您可能会得到一个高度，例如649.5 点。

在3x 屏幕缩放设备上，帧值可以四舍五入到1/3 点，因此您可能会得到649.6666667 点的高度。

【讨论】：