Swift开发中SVG图片缩放后画质丢失问题求助

看起来你遇到的是SVG作为按钮图片缩放后失真的典型问题，结合你给出的设置和代码，咱们一步步来调整：

1. 修正Asset的Scale属性设置 #

你提到当前Assets里的Scale属性是Single Scale，这是关键问题之一。SVG是矢量图，应该设置为Vector类型，这样iOS会根据不同屏幕的分辨率自动渲染合适的矢量版本，从根源上避免缩放时的像素丢失：

• 打开Assets.xcassets，选中你的SVG图片
• 在Attributes Inspector里，把Scale从Single Scale改为Vector
• 同时确保Render As设置为Original Image，避免系统自动 tint 处理影响画质表现

2. 优化按钮和ImageView的布局配置 #

你的代码里设置了button.imageView?.contentMode = .scaleAspectFit，这个本身没问题，但可以结合布局细节再优化：

• 如果你希望图片完全填充按钮且不失真，同时保持比例，可以试试把contentMode改成.scaleAspectFill，但记得给imageView加上clipsToBounds = true，避免超出按钮范围：

button.setImage(UIImage(named: img1.rawValue), for: .normal)
button.contentHorizontalAlignment = .fill
button.contentVerticalAlignment = .fill
button.imageView?.contentMode = .scaleAspectFill
button.imageView?.clipsToBounds = true

• 如果还是想保留.scaleAspectFit，那要尽量保证按钮的尺寸是SVG原始比例的整数倍，避免非整数倍缩放导致的模糊感

3. 矢量图渲染的小技巧 #

有时候直接用UIImage(named:)加载SVG可能会被提前光栅化，你可以尝试通过UIGraphicsImageRenderer重新渲染矢量图，确保缩放时的清晰度：

func vectorImage(named name: String, size: CGSize) -> UIImage? {
    guard let svgImage = UIImage(named: name) else { return nil }
    let renderer = UIGraphicsImageRenderer(size: size)
    return renderer.image { context in
        svgImage.draw(in: CGRect(origin: .zero, size: size))
    }
}

// 使用方式
let targetSize = button.bounds.size
if let vectorImg = vectorImage(named: img1.rawValue, size: targetSize) {
    button.setImage(vectorImg, for: .normal)
}
button.contentHorizontalAlignment = .fill
button.contentVerticalAlignment = .fill
button.imageView?.contentMode = .scaleAspectFit

4. 检查SVG文件本身 #

有些SVG文件可能包含嵌入式的光栅元素，或者复杂路径导致渲染时失真，你可以：

• 用Figma、Sketch这类工具重新导出SVG，导出时勾选"Outline Strokes"和"Embed Fonts"（如果SVG里包含文字）
• 简化SVG的路径，去掉不必要的锚点和复杂效果，减少渲染压力

按照这些步骤调整后，你的SVG图片应该就能在缩放时保持清晰的矢量画质了。

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