
功能特色
1、帮助设计师和工程师协同工作2、能够将Photoshop或Sketch设计稿中的各种设计元素导出,包括颜色、图片资源、字体、排版样式、CSS及大小尺寸等
3、帮助用户检查Photoshop和素描项目和出口任何包含的元素以最小的努力
4、图形对象将被上传到Avocode云,和你分享他们公开或与您的团队成员在任何时候
使用教程
1、注册登录之后。现在需要创建一个文件夹。创建文件夹可以选择你需要的切图的类型,有IOS,ANDROID,WEB三种类型。知识兔这里选择的WEB
2、进入之后可以选择上传按钮上传知识兔的PSD文件,这里有一个问题,就是这是国外的软件,服务器在国外,如果没有科学上网的话,上传的速度会让你痛不欲生,所以作为一个程序员科学上网是非常重要的

3、打开这个psd之后,可以看到很多工具栏,avocode由于版本的更新,工具栏的位置是会发生改变的。本文中的使用的版本是2.12.5。在界面中的左边,有四个按钮图层、活动信息、版本记录、psd的各种相关信息。上边的工具栏是对psd进行具体的切图工作。右边的工具栏显示的是具体选中或者进行操作的获得的图层信息。

4、工具栏的介绍,第一个手形这个按钮代表着你可以拖动的整个文件

5、第二个按钮有点像photoshop中的选择按钮,可以直接选择psd中的一个图层,当知识兔选中某个图层之后,知识兔就可以进行知识兔切图的工作的重头戏。假如选中图层中有一个标题

6、在右边显示关于这个标题的css信息,这个css可以包含color、font-size、border-color、background-color等等。有了这些信息,写css就会相当容易
7、当你需要这个图层导出图片当背景,就可以右键选中导出图片,某些情况下还支持svg格式,也可以支持base64
8、第三个是测量按钮,这个可以获得选中图层的大小和周围的间距大小

9、第四个是取色按钮,这个就用取色器直接吸取这个图层的颜色

10、第五个是裁剪按钮,这个也有点类似photoshop的裁剪功能

更新日志
Avocode Mac v2.14.2更新内容1、增加新功能—裁剪功能
2、修改Bug
3、对部分旧版功能进行优化
下载体验