1、实现选中想要的Group切图保留透明部分。
2、点击:+加号。
3、点击:刀的图标 。
4、勾选 Export Group Contents Only 的操作。
5、实现的切图效果如下。
6、实现Export如图。
注意事项:
矢量绘图也是进行网页,图标以及界面设计的最好方式。但除了矢量编辑的功能之外,Sketch同样添加了一些基本的位图工具,比如模糊和色彩校正。
可以通过摹客iDoc Sketch插件,上传Sketch设计稿以进行标记切图等。
打开插件
插件安装好后打开Sketch,在「Plugins(插件)」中找到摹客 iDoc 插件,选择并打开。
标记切图
切图往往存在两种形式:素材填满整个切图或者素材周围带空白区域。
素材填满整个切图:
在Sketch中选中需要切图的图层或编组;
点击右下角的Make Exportable,上传至iDoc即可。
无需再设置多种切图倍率,iDoc将自动生成不同倍率的切图。
素材周围带空白区域:
在Sketch中选中需要切图的图层或编组,点击右下角的Make Exportable;
再点击“切刀” 工具,对外框大小进行调整即可。
上传设计稿
切图完成后点击“上传”,即可将设计稿资源一键上传至 iDoc,设计师和开发可登录摹客 iDoc 查看标注与下载切图。
在sketch里做完设计后,可以用墨刀给sketch设计稿做自动标注,分享链接给开发哥哥,他们就可以查看标注了~
操作办法:下载“墨刀sketch插件”并安装,在sketch里选择页面导出到墨刀项目里,点击“分享”获取分享链接,发给开发,他们就能在“标注”处查看标注了。
墨刀官网sketch标注分享图:
希望对你有帮助!欢迎追问~
安装一个蓝湖Sketch插件可以自动切图。
第一步: 通过蓝湖插件在Sketch中标记你需要生成的切图 。
方法①: 用export标记切图 (忽略透明区域);
方法② :用切刀工具(slice)切图(保留透明区域);
第二步:通过蓝湖插件将页面上传至蓝湖。
第三步: 在蓝湖Web端,双击设计图查看标注和切图。
在这个页面,你家的工程师可以:
①查看任意元素的大小、字号、距离等信息,并直接复制该信息对应的代码;
②一键下载切图文件。
(注:蓝湖暂时无法识别出对symbol进行的切图哦)