分享一个基于 Canvas 的 WEB 端多功能画画板
1
这是一个创建于 683 天前的主题，其中的信息可能已经有所发展或是发生改变。
分享一个我之前做的画画版，上一个功能迭代也是上半年的事情了，最近几个月被工作缠的一点时间都没有，只改了一点小的交互和 BUG 。然后最近终于有了些空闲，于是决定继续迭代，增加一些新功能。目前是有以下功能
- 画笔: 支持颜色修改、动态线宽和多种画笔效果。
- 橡皮擦: 通过鼠标线性移动来擦除内容。
- 文字绘制: 双击画板可以绘制文字。
- 拖拽功能: 按住空格键随意拖拽画布。
- 选择模式: 通过点击元素进行元素框选，按住手柄可以缩放或移动元素，按下 Backspace 键可删除选中的元素。
- 图层管理: 图层按照顺序进行显示，可以新增、删除和排序图层。
- 撤销与保存: 支持撤销、反撤销、清除和保存功能。
接下来的计划是做移动端适配（这个优先级最高，现在只支持 PC ，我最初就是想做平板和移动端，用手指绘画，然后两指或三指拖拽缩放，但是一直没做到）、背景颜色和图片切换、面板缩放以及登录与数据同步分享这几个功能。
分享出来是想让大家提提意见，看有什么酷炫的功能或者效果可以加入进去，当然，如果能给个 Star 就更棒了，哈哈
Github: https://github.com/LHRUN/paint-board
Link: https://songlh.top/paint-board
 | 1 deiphi 2023-12-04 09:23:12 +08:00 绘画这些功能还是很赞，但是文字输入部分，个人认为有几点做得还不够好。 1 、在工具栏没有“输入文字”的图标或引导。 2 、文字输入后似乎不能修改文字内容和颜色。 3 、文字不能选择字体。 另外期待移动端适配：） |
 | 2 zjsxwc 2023-12-04 09:25:23 +08:00 up ，我有个需求，能不能粘贴我当前剪切板里复制过的图片，到图层里，然后能拖动被粘贴剪切板里图片的位置。 |
 | 3 liangxin1998 2023-12-04 09:31:55 +08:00 @zjsxwc 那是你的需求不是 up 的需求 |
 | 4 eWS2mq278TTzoj0O 2023-12-04 10:00:29 +08:00 做的很棒，star 了 |
 | 5 PlanV 2023-12-04 10:02:45 +08:00 真不错，很牛啊，star 了 |
 | 6 LHRUN OP @deiphi 多谢提议，1. 这个是要加的，如果现在没有看说明，应该没有人会想要双击的，即使双击了也不知道是要干什么。2. 这个我之前没有考虑过，但应该是个必须的功能。3. 这个我之后看一下可以怎么做，其实可以提供一些免费字体用于选择，比如谷歌的 |
 | 7 yangheng4922 2023-12-04 10:05:38 +08:00 上层图层用橡皮檫的痕迹会盖住下面的图层 |
| 8 LHRUN OP |
| 9 LHRUN OP @yangheng4922 这个不知道是不是我的图层理解问题，也有别人给我提过，我认为上层图层的操作应该都会覆盖到下面的图层，包括橡皮擦，如果你不想要覆盖，应该要调换这个图层的顺序 |
 | 11 daydreamcafe 2023-12-04 10:21:17 +08:00 做得很好，简单易用而且看了下代码，很简洁易懂，先 star 了，改天找个时间好好精读一下，感觉是个值得学习的 canvas 示例项目 |
 | 12 WesleyQin 2023-12-04 10:43:28 +08:00 加载图片作为底层，调整图片的透明度。 支持 pad ，最好能支持笔触，ipad pencil 屏蔽手指误触 用来给小朋友临摹图片。 |
| 13 yangheng4922 2023-12-04 11:04:01 +08:00 | |
| 14 LHRUN OP @daydreamcafe 谢谢，不过之前做的有些只考虑了功能，没考虑一些优化细节（部分逻辑有点烂），并且没有用任何 canvas 库，现在已经有点性能问题了，我现在也在想到底是坚持自己写，还是开始接入 canvas 库重写部分逻辑 |
| 16 LHRUN OP @yangheng4922 那可能和我最初的设计有点出入了，不过多谢建议 |
 | 17 sankooc 2023-12-04 13:25:49 +08:00 不错 不错 star 了 |
 | 19 nicoljiang PRO 效果不粗，但是在 retina 上清晰度好像比较低。 |
| 20 LHRUN OP @nicoljiang 记录了，后面我看看 |
Select Language