SwiftUI如何仅缩放大于80×120的图片，保留小图原尺寸？

你的问题出在默认的.resizable()配合.aspectRatio(contentMode: .fit)会让图片尽可能填充可用的frame空间，导致小图被自动放大。要实现仅缩小超大图、保留小图原尺寸的效果，核心是控制图片的缩放比例不超过1.0（即不放大）。

方案一：自定义封装View #

通过计算图片的原始尺寸，动态设置合适的frame大小，确保缩放比例不超过1.0：

struct SizeLimitedImage: View {
    let imageName: String
    let maxWidth: CGFloat
    let maxHeight: CGFloat
    
    // 计算最终显示尺寸
    private var scaledSize: CGSize {
        guard let uiImage = UIImage(named: imageName) else {
            return CGSize(width: maxWidth, height: maxHeight)
        }
        // 计算宽、高方向的缩放比例，取最小值且不超过1.0
        let widthRatio = maxWidth / uiImage.size.width
        let heightRatio = maxHeight / uiImage.size.height
        let scale = min(widthRatio, heightRatio, 1.0)
        
        return CGSize(
            width: uiImage.size.width * scale,
            height: uiImage.size.height * scale
        )
    }
    
    var body: some View {
        Image(imageName)
            .resizable()
            .aspectRatio(contentMode: .fit)
            .frame(width: scaledSize.width, height: scaledSize.height)
    }
}

使用方式：

SizeLimitedImage(imageName: MY_IMAGE, maxWidth: 120, maxHeight: 80)

方案二：自定义图片修改器 #

如果不想封装View，也可以给Image扩展一个自定义修改器，逻辑和上面一致：

extension Image {
    func limitMaxSize(maxWidth: CGFloat, maxHeight: CGFloat) -> some View {
        // 尝试获取UIImage以计算原始尺寸
        guard let imageName = self.name, let uiImage = UIImage(named: imageName) else {
            return self
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(maxWidth: maxWidth, maxHeight: maxHeight)
        }
        
        let widthRatio = maxWidth / uiImage.size.width
        let heightRatio = maxHeight / uiImage.size.height
        let scale = min(widthRatio, heightRatio, 1.0)
        
        return self
            .resizable()
            .aspectRatio(contentMode: .fit)
            .frame(
                width: uiImage.size.width * scale,
                height: uiImage.size.height * scale
            )
    }
}

使用方式：

Image(MY_IMAGE)
    .limitMaxSize(maxWidth: 120, maxHeight: 80)

原理说明 #

两种方案的核心逻辑都是：

1. 获取图片的原始尺寸
2. 计算宽、高方向相对于最大限制的缩放比例
3. 取两个比例的最小值，同时确保缩放比例不超过1.0（避免小图被放大）
4. 根据最终缩放比例设置图片的frame大小

这样就能实现：超大图按比例缩小到限制尺寸内，小图保持原始尺寸显示。

内容的提问来源于stack exchange，提问作者Andriy Gordiychuk