在 iOS 应用程序中使用 HeroIcons 时模糊的 SVG 渲染答案

【问题标题】：Blurry SVG render when using HeroIcons in iOS app在 iOS 应用程序中使用 HeroIcons 时模糊的 SVG 渲染
【发布时间】：2021-09-09 19:38:41
【问题描述】：

我在我的 iOS 应用程序中使用 HeroIcons (https://github.com/tailwindlabs/heroicons)。我已将所有 SVG 文件添加到资源包中，并且能够使用 SwiftUI 呈现 SVG。

但是渲染的图标看起来很模糊

这是 SVG 配置

这是SwiftUI代码sn-p来显示图标

任何 SVG 导出都可以帮助我解决这个问题？

【问题讨论】：

【解决方案1】：

只需在图像配置中选择“保留矢量数据”选项，即可解决您的问题。

【讨论】：

我有一些有问题的 SVG 资产会变得模糊 - 我可以确认这是可行的。因此，请确保在 Attribute Inspector 中为图像资源选择了“Preserver Vector Data”。这应该确保您的资产清晰、清晰且可扩展。
我启用了这个Preserver Vector Data，但它仍然看起来很模糊。
你有没有想过这个问题？只需在资产目录中的图像上设置适当的选项（保留矢量数据，单一比例）肯定有效，并且与其他 cmets 不同，Image 不是问题。这很好用：``` Image("adjustments").resizable().frame(width: 200, height: 200, alignment: .center) ``
对我来说，在使用 SwiftUI 的Image("name")时，它在 iOS 14 模拟器上是模糊的，而在 iOS 15 模拟器上是清晰的
我有同样的问题，在一个模拟器上模糊而在另一个模拟器上锐利。修复方法是单击模拟器菜单上的 Device>Erase all Contents and Settings，这会强制在其中使用所有新文件进行新构建，现在看起来不错。

【解决方案2】：

如果大卫的建议不起作用，那么这可能会起作用：

Image(uiImage: .init(named: "HeroIcons/outline/adjustments", in: Bundle.module, compatibleWith: nil))
       .resizable()
       ...

【讨论】：

【解决方案3】：

我坚信Image 对SVG 的渲染机制有问题。

在这个问题之后，我采用了使用UIImageView + UIViewRepresentable 来渲染SVG，效果很好。

您可以在此处查看与 SwiftuI 兼容的UIImageView 的类似实现：https://stackoverflow.com/a/61178828/452115

【讨论】：