文章目录
一、来自女朋友的切图需求
正在撸码的我，无意之中又听到了女朋友的叹息：“切图太浪费时间了“。是的，我的女朋友是一个UI设计师，她设计的图片可以绕地球一周，但是设计师的痛点就是切图费劲，特别是给APP的logo切图的时候，一个logo要切10几个不同的大小，实在是痛苦。
有mac电脑的UI还好一些，最起码有mac软件可以一键切图，但是在windows下就不是那么友好了。因此，我决定帮帮妹子，争取给他弄个一键切图工具，下面分享下一键切图的原理部分，脚本运行环境是debian系统服务器。
二、一键切图大致原理
在网上百度的时候，看到一个ios大佬写了个一键切图的脚本，感觉思路相当不错，只可惜他的脚本中是使用的sips来实现批量缩放图片的，我们linux可没有这个东西，不过大佬的思路是极好的，我们可以找一下linux控制图片缩放尺寸的工具包。
大佬链接：https://www.jianshu.com/p/42e5becb4cb2
1、大致思路
（1）在脚本中获取要切的logo图片
（2）定义数组，数组里面是我们要切的尺寸大小和图片名称
（3）循环数组，然后使用linux下的缩放工具生成新图片
（4）把生成的新图片保存到新的文件夹中
2、linux下图片缩放工具
经过百度，我们选用ImageMagick作为图片缩放的工具包，可以使用它的Convert的resize子命令，我们定义好图片的大小尺寸之后，就可以生成新图片的。
（1）安装ImageMagick
apt-get install ImageMagick
（2）子命令生成图片
convert -resize 图片名称 原图片 新文件夹。
（3）查看生成图片尺寸信息
identify [email protected]
[email protected] PNG 16x16 16x16+0+0 8-bit sRGB 236c 1.27KB 0.000u 0:00.000
可以看到这是16x16尺寸的图片
三、生成不同尺寸logo的shell脚本
明确上面原理之后，博主按照女朋友的想法，定义了她想要的logo尺寸，一下生成11个文件，怪不得不想切图呢。。
1、脚本代码
#!/bin/bash
# 脚本使用方法：直接把脚本拖入终端 然后回车键即可执行
# ⚠️注意1：将脚本与logo放在同一个文件夹里
# ⚠️注意2：如果执行脚本时出现如下错误是因为文件权限不足，只需对其授权777即可
################## 参数配置logo图标名称（最好用1024x1024的logo）##################
filename="logo.png"
printf "
#######################################################################
# 博主名称：铁柱同学
# 博客链接：https://blog.csdn.net/LJFPHP
#######################################################################
"
dirname="icon_cutimg"
name_array=("[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]" "[email protected]")
size_array=("16x16!" "60x60!" "72x72!" "80x80!" "90x90!" "96x96!" "120x120!" "144x144!" "180x180!" "512x512!" "1024x1024!")
# 获取脚本当前所在目录(即上级目录绝对路径)
root_dir=$(cd "$(dirname "$0")"; pwd)/
# 切换到当前脚本的工作目录
cd ${root_dir}
# 创建文件夹存放自动切图
mkdir $dirname
for((i=0;i<${#name_array[@]};++i)); do
m_dir=$dirname/${name_array[i]}
cp $filename $m_dir
convert -resize ${size_array[i]} $filename $m_dir
#convert -resize 500x500! $filename $m_dir
done
2、脚本在服务器的目录结构
ls
AutoCutting.sh logo.png
logo.png是原logo图片，最好是1024x1024的
Auto 是咱们自动脚本的名称，记得给777权限
3、生成logo图片
在当前目录上执行：
./AutoCutting.sh
这里如果使用 sh 脚本名称 的方式启动的话，可能会报错：
Syntax error: "(" unexpected
这是因为脚本没有指定执行的sh是哪个，可以考虑指定bash运行，也可以像博主这样直接 ./.sh脚本执行。
效果如下：
root@ljf:/home/ljf/img# ./AutoCutting.sh
#######################################################################
# 博主名称：铁柱同学
# 博客链接：https://blog.csdn.net/LJFPHP
#######################################################################
root@ljf:/home/ljf/img# ls
AutoCutting.sh icon_cutimg logo.png
root@ljf:/home/ljf/img# cd icon_cutimg/
root@ljf:/home/ljf/img/icon_cutimg# ls
[email protected] [email protected] [email protected] [email protected] [email protected] [email protected]
[email protected] [email protected] [email protected] [email protected] [email protected]
生成的icon_cutimg 里面就是我们需要的logo图片。查看能看到生成了我们想要的图片。
4、通过wincp把图片都下载下来
如图：
OK，女朋友想要的尺寸全部生成。（PS: 虽然后几张看起来大小一样，实际上查看属性，分辨率已经是我们想要的分辨率了。）
四、其他
1、脚本适用性
这个脚本适合各位大佬给自己女朋友使用，本质上实用性不高，毕竟没linux基础的人也用不了
2、windows下不能使用
博主想在windows下试试，图片是生成了，但是尺寸没有变化，可能是因为没在windows下找到合适的控制图片缩放的工具。还是在linux上面方便，一行命令就搞定了
3、仍需完善
这只是个初级版本，有时间的话可以做个工具，一切都是为了让女朋友开心，哈哈
归根结底，还是因为女朋友没MAC的原因啊！博主背锅，看来买个MAC来设计是势在必行了！
end