将SVG转换为适用于iOS和Android的应用程序图标的最佳方法是什么？

Question

我正在寻找一款工具，可以从一个svg图像生成适用于iOS和Android应用程序的不同大小的图标。

谷歌并没有提供任何“一键式”解决方案。 是否有其他不太为人知的工具？或者一些简单的批处理脚本可以实现相同的功能？

理想情况下，我希望能在我的Windows 10机器上运行，但Linux也可以。

- xorinzor

---

关于安卓，你试过在安卓工作室（Assets Studio）中构建吗？你可以直接导入 SVG 文件，它会转换成 XML 文件。同时也支持 PSD 文件的使用。 - Bartosz

我正在尝试使用Flutter构建应用程序，因此还没有考虑过这个。我想一个简单的工具已经存在于此目的，但实际上我很惊讶我还没有找到一个。 - xorinzor

我知道这不完全是你要求的，但我正在使用它来处理png和jpg文件。https://github.com/asystat/Final-Android-Resizer。它可以生成所有大小的png文件。此外，根据以下标准：Android与iOS：mdpi = 1x，xhdpi = 2x，xxhdpi = 3x。你应该能得到你想要的结果。 - Bartosz

没有点踩，但我认为工具推荐不适合在SO上讨论。可能在SuperUser上是适合的，但你需要对该网站进行一些研究。无论如何，如果你愿意使用命令行，请考虑Imagemagick，你可以指定DPI，这样你就不需要调整图像的大小了。 - Frenzy Li

@xorinzor 嗯，看到“即使它们符合上述类别之一，仍有一些问题是不适合讨论的。”所以即使涉及开发人员使用的软件工具，“要求我们推荐或寻找书籍、工具等”的问题也是不适合讨论的。 - Frenzy Li

Answer 1

首先使用此链接https://svgtopng.com/将您的SVG转换为PNG，一旦转换完成，请使用此链接https://makeappicon.com/为Android和iOS创建应用程序图标。

- Faldu Jaldeep

---

先转换为PNG格式再进行调整大小会导致质量下降，特别是在曲线处更为明显。 - xorinzor

这个网站更方便，不需要输入你的电子邮件地址：https://appicon.co/ - voxoid

@xorinzor，非常重要的一点。你仍然可以通过导出非常高分辨率版本（16384x16384）并将其上传到appicon.co来获得完美的结果。 - voxoid

Answer 2

我的选择是https://github.com/sterlp/svg2png。 对于IOS:

java -jar svg2png.jar -f app_icon.svg -o yourFolder/Assets.xcassets/AppIcon.appiconset -c ios_icon.json

有这样一个 ios_icon.json 文件：

{
  "files": [
    {
      "nameSuffix": "-20x20@1x",
      "height": 20,
      "width": 20
    },
    {
      "nameSuffix": "-20x20@2x",
      "height": 40,
      "width": 40
    },
    {
      "nameSuffix": "-20x20@3x",
      "height": 60,
      "width": 60
    },
    {
      "nameSuffix": "-29x29@1x",
      "height": 29,
      "width": 29
    },
    {
      "nameSuffix": "-29x29@2x",
      "height": 58,
      "width": 58
    },
    {
      "nameSuffix": "-29x29@3x",
      "height": 87,
      "width": 87
    },
    {
      "nameSuffix": "-40x40@1x",
      "height": 40,
      "width": 40
    },
    {
      "nameSuffix": "-40x40@2x",
      "height": 80,
      "width": 80
    },
    {
      "nameSuffix": "-40x40@3x",
      "height": 120,
      "width": 120
    },
    {
      "nameSuffix": "-60x60@2x",
      "height": 120,
      "width": 120
    },
    {
      "nameSuffix": "-60x60@3x",
      "height": 180,
      "width": 180
    },
    {
      "nameSuffix": "-76x76@1x",
      "height": 76,
      "width": 76
    },
    {
      "nameSuffix": "-76x76@2x",
      "height": 152,
      "width": 152
    },
    {
      "nameSuffix": "-83.5x83.5@2x",
      "height": 167,
      "width": 167
    },
    {
      "nameSuffix": "-1024x1024@1x",
      "height": 1024,
      "width": 1024
    }
  ]
}

请确保生成的png文件与您在AppIcon.appiconset/Contents.json中的配置相匹配。我的配置如下：

{
  "images" : [
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "20x20",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "20x20",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "29x29",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "29x29",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "40x40",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "40x40",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "60x60",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "60x60",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "20x20",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "20x20",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "29x29",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "29x29",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "40x40",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "40x40",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "76x76",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "76x76",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "83.5x83.5",
      "filename" : "[e-mail]"
    },
    {
      "idiom" : "ios-marketing",
      "scale" : "1x",
      "size" : "1024x1024",
      "filename" : "[e-mail]"
    }
  ],
  "info" : {
    "author" : "xcode",
    "version" : 1
  }
}

如需 Android 版本，请参阅https://github.com/sterlp/svg2png上的 README，或创建您自己的 JSON 配置。

- Viktar

---

请在您的回答中添加一些细节。 - AsthaUndefined

当然！很高兴为您服务！请告诉我哪个部分缺少细节，因为从我的角度来看很难看出来。 - Viktar

Answer 3

这已经很晚了，这是关于ANDROID的，但你实际上可以直接在android studio中转换svg文件。从res文件夹中的drawable文件夹右键单击并选择矢量资源：然后选择本地文件（SVG、PSD）您可以从路径字段中选择svg文件，android studio将直接将该文件转换为资源。

- MetaSnarf

Answer 4

现代设计工具（Figma，Zeplin...）可以帮助您生成iOS、Android所需的必要图像

- yoAlex5