我通常在交接工作时除源文件外，还会把Icon切好打包发給研发。切图主要有两种方式，下面举例说明。
APP中的一个版块
第一种 整套切图
第一步：整理Icon
一套完整的Icon
最好能将整个APP的Icon分组整理在一个文件中，这样可以帮助自己规范样式和尺寸，并直接在此文件中进行细节优化调整，减少因同一个图标在不同页面反复出现，需进行多次调整的情况。
第二步：导出Icon
选择所有画板，点击右下角［＋］加号，添加@2x、@3x。（如果设计图本身就是二倍图，那么就添加@1x、@1.5x）。点击［Export Artboards］导出即可，建议导出到一个独立的文件夹中，或者导出前新建一个文件夹。不然结果会被吓到！
选择所有画板
添加@2x、@3x。或@1x、@1.5x
导出至独立文件夹
技巧：
画板命名方式可以帮助自己将导出的图片分组归类。
命名方式：名字/... /名字，命名中间用英文“/”符号分割。默认“/”最后一个是Icon名称，之前的全是文件夹名称，一层套一层。
命名及对应导出文件
第二种 单个切图
第一步：选择Icon
选择要切的icon。将它复制粘贴到画板外空白处，这样可以保证切的图是无背景的效果。
复制Icon到画板外空白处
第二步：导出Icon
选择画板外的Icon，点击右下角［＋］加号，添加所需要的icon倍数。［Export Artboards］导出即可。
选择画板外icon导出
小结
切图不应该浪费我们太多时间，Sketch做到了。这两种导图方式分别适用于不同的工作场景。并且很多好的习惯可以帮助我们节省时间，比如命名方式。
网友评论