我购买了一个来自The Noun Project的SVG图标。然后，我使用macOS上名为Gapplin的程序将这个SVG导出成PNG图像。最终得到了一个尺寸为100x100像素的图像。
接下来，我使用Preview程序打开此PNG图像，并转到“工具”->“调整大小”，创建10x10、20x20和30x30像素的图像。然后，我在Xcode中将这些图像作为1x、2x和3x加载。
这样做是正确的方法吗？
在iOS应用程序中加载基于SVG的图像资源
19
- JK140
1
可能是如何在Xcode中使用矢量图像（即pdf文件）？的重复问题。 - dlackty
2个回答
24
不，这不是最佳解决方案。
你当前的解决方案当然可以工作，但离理想还差得远。在这样做时，你正在失去（宝贵的！）图像质量（有关详细信息，请点击此处）。你可以通过以下方式改进你的工作流：
关于应用程序文件大小，你不应该再看到任何方法上的区别了。即使使用最后一种方法，Xcode仍然会在编译时生成所需的资源，并且因此，你的应用程序将携带与第一种方法相同的图像/图标集。
你当前的解决方案当然可以工作，但离理想还差得远。在这样做时，你正在失去（宝贵的！）图像质量（有关详细信息，请点击此处）。你可以通过以下方式改进你的工作流：
导出原始SVG文件的全部3个分辨率，确保从基于向量的图像源获取最佳可能的PNG位图（使用Gapplin或其他图像应用程序）；
或者将SVG转换为PDF，然后在Xcode中导入PDF向量图像文件（最近一次我检查，Xcode 8仍然没有直接支持SVG文件，所以现在我们还停留在老式的PDF上）。
关于应用程序文件大小，你不应该再看到任何方法上的区别了。即使使用最后一种方法，Xcode仍然会在编译时生成所需的资源，并且因此，你的应用程序将携带与第一种方法相同的图像/图标集。
- Paulo Mattos
6
那么您的意思是将SVG文件直接导出为10x10、20x20和30x30的PNG文件？此外，1x必须是10x10，2x必须是20x20等吗？还是可以增加尺寸？ - JK140
1@JK140 是的，可以直接从SVG导出到所需的分辨率！关于实际大小，这取决于您的图标将在哪里使用。请参见此处以获取一些示例：[https://developer.apple.com/ios/human-interface-guidelines/graphics/app-icon/]。 - Paulo Mattos
非常感谢！由于某种原因，我正在使用的程序Gapplin不允许我直接导出所需的分辨率。您知道Mac上还有哪些其他免费的程序可以做到吗？ - JK140
我正在使用图像作为UIButton的一部分，宽度为20，高度为20。您知道我应该将SVG图像导出为1x、2x和3x的正确png分辨率吗？我一直在使用30x30、60x60、90x90，但这只是猜测。我应该使用更大的图像，比如100x100、200x200、300x300吗？这样会提供更好的质量，但加载时间可能会更长吗？ - JK140
@JK140 为了达到像素完美的效果，你应该使用20x20、40x40、60x60。1x分辨率将1:1 点 映射为 像素。因此，在1x比例下，宽度为20个点应需要20个像素。在这里查看更多信息，以更好地理解原因... - Paulo Mattos
2
我知道这个答案来得很晚。但是从Xcode 12开始，并且使用macOS 10.15或更高版本、iOS 13或更高版本和iPadOS 13或更高版本的部署目标，您应该能够直接在资源目录中使用SVG图像。根据Xcode 12发布说明：
我自己还没有理由或机会使用它，但听起来应该可以工作。资源目录
新功能
- 添加了对可缩放矢量图形（SVG）图像资源的支持。这些图像资源在部署目标为macOS 10.15或更高版本、iOS 13或更高版本和iPadOS 13或更高版本时会保留其矢量表示。（18389814）
- Cem Schemel
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接