Photoshop测距和切图

Photoshop工具栏“窗口”勾选“信息”，显示信息面板，信息面板右上角“面板选项”单位选择“像素”

  • 使用矩形选框工具可以测量距离
  • 使用移动工具按住ctrl键可以快速显示间距
  • 使用吸管工具+拾色器获取颜色数值
  • 移动工具点击字体图层，工具栏“窗口”勾选“字符”，获取字体信息

切图

  • 编辑 -> 首选项 -> 增效工具 -> 启用生成器
  • 文件 -> 生成 -> 图像资源
  • 双击图层名字，添加后缀(.png),则会自动生成一个目录，里面有切好的图片
  • 在名字前加上百分数如(200% aaa.png) 则会自动放大或缩小对应倍数

    蓝湖App快速标注

    https://lanhuapp.com/
    在官网下载photoshop插件，安装到photoshop,设计师可以把psd文件通过插件上传到蓝湖，
    在蓝湖上可以轻松获取各种数值
    如果用插件标记切图，则可以直接下载切图

PxCook快速标注

https://www.fancynode.com.cn/pxcook
和蓝湖类似，PxCook是本地版的标注工具
标注功能更强大，适合移动端标注

imgcook

https://www.imgcook.com/
由设计稿直接生成代码，可作为开发辅助