PS拉框助手

PS拉框助手是一款可以帮你在ps中快速生成可编辑的各类型图表的插件，以前我们需要在ps中生成图标只能自己慢慢去画，这样费时费力还不一定讨得了好。现在大家可以利用这款PS拉框助手插件来一键填充真实图表，它能够快速的生成折线图、柱状图、饼图、雷达图、全国各省市的地图等常见的ui元素。

插件特色：

节约时间

一般来说，使用PS绘制真实数据的图表是一个非常耗时的过程

简单方便

拉个框，填写颜色值，点击确定就可以轻松获得你想要的图表效果

自动化

自动化绘制的视觉元素将准确地表示数字、尺寸、间距，实现结果真实可靠。

容易实现

拉框助手生成的界面，开发小哥使用Echarts一定能够实现，实现效果能与设计图一致

插件介绍：

点击「下载插件V1.0.0.1」下载压缩包，按照顺序来一步步安装这款 PS 扩展插件。（注：附带字体均可免费商用）

安装好后我们打开 PS，在窗口-扩展功能里能看到 PS 拉框助手，点击即可打开。

插件的界面顶端是图表的种类，而界面底端则是「快速导入导出JSON数据」以及「教程查看」的功能。（注：拉框助手目前只支持文档分辨率为 72 像素的文件）

使用方法：

折线图图表生成和调整

第一步：用矩形选框工具，在画布上拉出一个框来，大小可按照你的实际需求来。

第二步：调整数据以及文字。

在拉框助手中，我们可以修改图表 X、Y 轴的参数以及线条样式、宽度、颜色等。（注：折线图 X 轴底部文字需要用英文逗号隔开）

点击「增加一组数据」，填写相应的参数，即可在图表上添加多组数据绘制多条数据折线。

数据能随机产生，也可以手动填写，但是随机数据的范围不会超过你规定的 Y 轴数据范围。

固定数据需填写每个点的值（用英文逗号隔开）。

最后，点击「确定」就能获得我们所绘制的折线图了，在右边的图层即可进行编辑修改。（电脑比较慢的小伙伴可能加载也比较慢）

不同图表生成和调整

再来看看咱们非常常见的其他类型图表。

1. 柱状图

同样的方式拉框、填写参数。

「柱子间距」可以设置为负数，能绘制出「带背景」的效果。

2. 饼状图

也是类似的方法就可以绘制，可控参数也非常多。

如果选中「数据」的话，在「选中偏移」中填写的值越大，饼图中选到的那块数据离圆心的距离就越远。

3. 地图

是的，你没看错。不仅可以拉图表，还可以拉中国各省市区的地图。

点击「去下载对应数据」拉框助手就会打开对应的网站，然后进行 JSON 数据的复制粘贴到拉框助手就能获得图形。

系统UI的生成与调整

PS 拉框助手还具备常用的 UI 元素，如：按钮、按钮组、窗口、输入框、下拉框、单选、多选、提示、表格、树等的一键绘制。

目前的版本只能绘制一套适用于深色背景下的 UI 元素，但是作者还在不断更新。

举个例子，我们来画个按钮：

先用矩形选框工具拉一个框；

编辑「按钮文字」，选择「按钮图标」。

就可以生成你想要的按钮图标啦。

按钮组的操作步骤也一样，点击「增加按钮」添加多个按钮并可以进行文字编辑以及位置调整。

窗口、输入框、下拉框、单选、多选、提示的操作大都相同。

表格绘制也非常轻松，先用矩形选框工具拉一个框，填写表格的行数和列数。（注：将行设置多一点，超出拉框的部分将不会绘制）

填写每个表头要展示的文字。 「类型」：序号、IP、MAC、姓名、年龄等。（会根据类型，自动生成一些默认的随机内容）

填写表格的具体内容：

就可以在 PS 里轻松完成一个表格的绘制。