Interface Builder：使用“Aspect Fit”时自动设置UIImageView的宽高比？ [英] Interface Builder: automatically set aspect ratio for UIImageView when using "Aspect Fit"?

问题描述

下面的共享图标（图像是白色的）是114x128像素。

The share icon (image is white) below is 114x128 pixels.

使用 Aspect Fit <将Interface Builder中的高度修复为23像素的AutoLayout / strong>对于内容模式不会更改框架矩形。

Fixing the height in Interface Builder to 23 pixels with AutoLayout then using Aspect Fit for the Content Mode does not change the frame rectangle, though.

这会导致对齐问题，因为如果您想要图标15来自后缘的像素，现在很难这样做。

This causes issues with alignment since if you want the icon 15 pixels from the trailing edge, it's now hard to do so.

一种选择是在IB内手动设置宽高比（即114/128）作为AutoLayout约束。

One option is to manually set the aspect ratio (i.e., 114/128) as an AutoLayout constraint within IB.

但这非常脆弱。如果您更改图像尺寸，则必须记住调整宽高比。

But this is extremely fragile. If you change the image dimensions, you must remember to adjust the aspect ratio.

IB是否有办法自动调整框架矩形和内容？

Is there a way where IB automatically adjusts the frame rectangle as well as the content?

最后一个选项是在代码中执行所有操作，但在IB中执行所有操作都是理想的。

The last option is to do everything within code, but doing everything within IB would be ideal.

框架矩形在IB中不变：

分享图标（此处不显示白色图标）：

推荐答案

我相信您必须以编程方式执行此操作。如果您不希望按视图进行查看，只需定义一些子类（可以指定为IB中的基类），以编程方式设置约束

I believe you'll have to do this programmatically. If you don't want to do it view by view, just define some subclass (which you can specify as the base class in IB) that sets constraints programmatically

class RatioImageView: UIImageView {

    private var ratioConstraint: NSLayoutConstraint?

    override var image: UIImage? {
        didSet { updateRatioConstraint() }
    }

    override func didMoveToSuperview() {
        super.didMoveToSuperview()

        updateRatioConstraint()
    }

    private func updateRatioConstraint() {
        if let ratioConstraint = ratioConstraint {
            removeConstraint(ratioConstraint)
        }

        guard superview != nil else { return }

        let ratio: CGFloat
        if let image = image {
            ratio = image.size.width / image.size.height
        } else {
            ratio = 1
        }

        ratioConstraint = widthAnchor.constraint(equalTo: heightAnchor, multiplier: ratio)
        ratioConstraint?.isActive = true
    }
}

这是在图像视图上进行的，但你可能想象同样使用 UIButton 或其他任何内容。

This does it on an image view, but you could presumably do the same with UIButton or whatever, too.

或在另一个r主题的变化，你可以用内在大小控制它，也许你明确设置 height （因为这是 @IBInspectable ，你可以在IB中做到这一点，它将返回为该高度缩放的内在大小：

Or in another variation of the theme, you could control this with intrinsic size, where perhaps you explicitly set the height (and because this is @IBInspectable, you can do this right in IB), and it will return the intrinsic size scaled for that height:

@IBDesignable
class RatioImageView: UIImageView {

    @IBInspectable var height: CGFloat = 0

    override var intrinsicContentSize: CGSize {
        guard let image = image else { return .zero }
        guard height > 0 else { return image.size }

        let ratio = image.size.width / image.size.height

        return CGSize(width: height * ratio, height: height)
    }

}

这篇关于Interface Builder：使用“Aspect Fit”时自动设置UIImageView的宽高比？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！