0%

shell脚本一键生成icon

shell脚本一键生成icon

在iOS开发中icon需要很多尺寸。具体需要哪些在这篇文章中有介绍。
所以有的时候需要我们去处理些图片。当然我们可以直接使用sketch生成相应的icon,但是因为需要的种类比较多,这样不够方便。所以打算写一个脚本,给一个icon可以生成我要需要的icon。

首先分析我们的需求只要简单的图片大小的改变和给图片重命名就可以完成我们的需求。搜索后查到mac上有sips可以处理,也可以用ImageMagicks。ImageMagick支持linux。

Mac下使用sips

安装

Mac下自带这个sips不需要安装

脚本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
#!/bin/bash
fileName=$1
echo "开始生成图标······"
sips -z 20 20 $fileName --out icon20@1x.png
sips -z 40 40 $fileName --out icon20@2x.png
sips -z 60 60 $fileName --out icon20@3x.png
echo "20pt图标生成······"
sips -z 29 29 $fileName --out icon29@1x.png
sips -z 58 58 $fileName --out icon29@2x.png
sips -z 87 87 $fileName --out icon29@3x.png
echo "29pt图标生成······"
sips -z 40 40 $fileName --out icon40@1x.png
sips -z 80 80 $fileName --out icon40@2x.png
sips -z 120 120 $fileName --out icon40@3x.png
echo "40pt图标生成······"
sips -z 50 50 $fileName --out icon50@1x.png
sips -z 100 100 $fileName --out icon50@2x.png
sips -z 150 150 $fileName --out icon50@3x.png
echo "50pt图标生成······"
sips -z 57 57 $fileName --out icon57@1x.png
sips -z 114 114 $fileName --out icon57@2x.png
sips -z 171 171 $fileName --out icon57@3x.png
echo "57pt图标生成······"
sips -z 60 60 $fileName --out icon60@1x.png
sips -z 120 120 $fileName --out icon60@2x.png
sips -z 180 180 $fileName --out icon60@3x.png
echo "60pt图标生成······"
sips -z 72 72 $fileName --out icon72@1x.png
sips -z 144 144 $fileName --out icon72@2x.png
sips -z 216 216 $fileName --out icon72@3x.png
echo "72pt图标生成······"
sips -z 76 76 $fileName --out icon76@1x.png
sips -z 152 152 $fileName --out icon76@2x.png
sips -z 228 228 $fileName --out icon76@3x.png
echo "76pt图标生成······"
sips -z 167 167 $fileName --out icon83.5@2x.png
echo "83.5pt图标生成······"
echo "全部图标生成······"

解释

sips -z 167 167 $fileName --out icon83.5@2x.png

-z 后面是宽度和高度 $filName 是你要处理的图片 –out是保存处理后的图片

关于sips的其他命令可以执行man sips或者sips --help查看。
这里方便Xcode识别所以用@1x、@2x、@3x来命名。

使用

在终端打开直接执行这个脚本后面跟上要处理的图片就可以了。图片分辨率不能很低于228x228并且保证比例为1:1。例如:

./ios_icon_shell_sips.sh icon500.png

这里就是处理的icon500.png这个图片,在当前目录下生成了所以需要的图片。

使用ImageMagick

安装

ImageMagic的安装请参考这篇文章

脚本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
#!/bin/bash

fileName=$1
echo "开始生成图标······"
convert -resize 20x20 $fileName icon20@1x.png
convert -resize 40x40 $fileName icon20@2x.png
convert -resize 60x60 $fileName icon20@3x.png
echo "20pt图标生成······"
convert -resize 29x29 $fileName icon29@1x.png
convert -resize 58x58 $fileName icon29@2x.png
convert -resize 87x87 $fileName icon29@3x.png
echo "29pt图标生成······"
convert -resize 40x40 $fileName icon40@1x.png
convert -resize 80x80 $fileName icon40@2x.png
convert -resize 120x120 $fileName icon40@3x.png
echo "40pt图标生成······"
convert -resize 50x50 $fileName icon50@1x.png
convert -resize 100x100 $fileName icon50@2x.png
convert -resize 150x150 $fileName icon50@3x.png
echo "50pt图标生成······"
convert -resize 57x57 $fileName icon57@1x.png
convert -resize 114x114 $fileName icon57@2x.png
convert -resize 171x171 $fileName icon57@3x.png
echo "57pt图标生成······"
convert -resize 60x60 $fileName icon60@1x.png
convert -resize 120x120 $fileName icon60@2x.png
convert -resize 180x180 $fileName icon60@3x.png
echo "60pt图标生成······"
convert -resize 72x72 $fileName icon72@1x.png
convert -resize 144x144 $fileName icon72@2x.png
convert -resize 216x216 $fileName icon72@3x.png
echo "72pt图标生成······"
convert -resize 76x76 $fileName icon76@1x.png
convert -resize 152x152 $fileName icon76@2x.png
convert -resize 228x228 $fileName icon76@3x.png
echo "76pt图标生成······"
convert -resize 167x167 $fileName icon83.5@2x.png
echo "83.5pt图标生成······"
echo "全部图标生成······"

解释

convert -resize 167x167 $fileName icon83.5@2x.png

-resize 后面跟分辨率宽度和高度 $fileName为要处理的图片
后面跟的是处理后的图片

注意

目前在最新版的macOS sierra(10.12)上不支持。在linux和老版本macOS上可以使用。

目前这个脚本还比较简单,只是实现了最基本的功能。并没有对输入文件进行格式判断,与分辨率判断。后面有时间继续完善。