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

Question

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

Google 无法真正为我提供任何“一键式”解决方案。 有没有什么鲜为人知的工具？或者也许是一些简单的批处理脚本可以达到同样的效果？

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

Answer 1

转换 .PNG 后，首先通过此链接 https://svgtopng.com/ 将您的 SVG 转换为 PNG，然后使用此链接 https://makeappicon.com/ 为 Android 和 iOS 创建应用程序图标。

Answer 2

这已经很晚了，这是针对ANDROID的，但是您实际上可以直接在android studio中转换svg文件，右键单击res文件夹中的drawable文件夹并选择矢量资产：

然后选择本地文件（SVG、PSD）

然后您可以从路径字段中选择 svg 文件，android studio 将直接将该文件转换为资源。

Answer 3

我的选择是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" : "app_icon-20x20@2x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "20x20",
      "filename" : "app_icon-20x20@3x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "29x29",
      "filename" : "app_icon-29x29@2x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "29x29",
      "filename" : "app_icon-29x29@3x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "40x40",
      "filename" : "app_icon-40x40@2x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "40x40",
      "filename" : "app_icon-40x40@3x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "2x",
      "size" : "60x60",
      "filename" : "app_icon-60x60@2x.png"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x",
      "size" : "60x60",
      "filename" : "app_icon-60x60@3x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "20x20",
      "filename" : "app_icon-20x20@1x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "20x20",
      "filename" : "app_icon-20x20@2x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "29x29",
      "filename" : "app_icon-29x29@1x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "29x29",
      "filename" : "app_icon-29x29@2x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "40x40",
      "filename" : "app_icon-40x40@1x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "40x40",
      "filename" : "app_icon-40x40@2x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "1x",
      "size" : "76x76",
      "filename" : "app_icon-76x76@1x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "76x76",
      "filename" : "app_icon-76x76@2x.png"
    },
    {
      "idiom" : "ipad",
      "scale" : "2x",
      "size" : "83.5x83.5",
      "filename" : "app_icon-83.5x83.5@2x.png"
    },
    {
      "idiom" : "ios-marketing",
      "scale" : "1x",
      "size" : "1024x1024",
      "filename" : "app_icon-1024x1024@1x.png"
    }
  ],
  "info" : {
    "author" : "xcode",
    "version" : 1
  }
}

对于 Android，请参阅https://github.com/sterlp/svg2png 上的 README 或创建您自己的 json 配置。