简单绘画系统制作

一.效果展示
本次我自己制作了一个小绘画系统，通过鼠标拖动的方式进行绘画
下面我将逐一介绍绘画系统的各个功能
首先是操作界面，如下图所示，我随便用鼠标画了一个小人

Brush / eraser size可以调节画笔的粗细程度，在这个绘画系统中，我设置了2,4,6,8,10这几个选项，数值越大，画笔越粗
往右走，是一个毛笔的图案和一个橡皮擦的图案，选中其中一种就可以调节使用画笔工具和橡皮擦工具
蓝色的按钮：clear all，点击一下就可以清除所有的画笔
我添加这个功能的原因是，如果用户觉得使用橡皮擦一点一点擦太麻烦而且觉得这次绘画整体并不理想，那就可以通过这种一键形式来清除画板
Quick palette是快捷选择颜色的功能选项，只要按下其中一种颜色，便可以迅速更改画笔的颜色
当然，如果觉得这几个颜色没有自己想要的，那也可以使用右方的选择颜色工具，如下图所示

点击，会弹出一个框，左方的颜色板可以选择颜色，也可以点击右方色板，选择更丰富的颜色，右下方的“添加到自定义颜色”可以把自己喜欢的颜色添加到上述的快捷选择颜色功能中去
Toggle screen是可以调节成全屏模式和窗口模式的，设计这个功能的原因是用户可以通过全屏更细致地作画
下图是全屏模式的效果图

下面是我的绘画系统的第二个功能
相当于动态码会，系统可以自动用不同的颜色绘制线条（动态）
如下图，一开始屏幕是空白的，然后不断出现动态的线条

然后线条越来越多，新出现的线条会覆盖住之前的线条

下面是我的绘画系统的第三个功能，该功能由两组螺旋的点状图案排列组成
图案可以自行按照螺旋方式不停地运动
左方speed可以调节，用于线条运动的速度
右方的size可以调节每个小圆点的大小，且每个小圆点的颜色不同

最后我做了一个调色盘，主页面如下

功能从上到下依次改变了

调色盘中颜色的色块大小
（count）、颜色半径（radius）、
透明度（opacity）、轨迹（trail，但因为代码报错的原因有点实现不明显）移动(movement)、Lift（提升）、重力（Gravity）、扩散（spread）、还分别可以调试红绿蓝的高频、低频的色泽明亮度。

还有把之前的调节重置等功能。

二.理论分享与学习心得
我认为，“函数”这个术语过于学术化，一看就是数学用语，很容易吓跑一大群小朋友。若叫做“功能“、”行为“、“作用”恐怕更为贴切，因为它表达的就是一个行为，即将一大段琐碎的具体过程用一个简单的称呼来概括的表达，例如函数draw中那么一大段代码，对其概括段落大意，即为”画“，也就是函数名”draw”。就“函数”这一术语的来源"function“一词，其实直观翻译便是”功能“，而非数学意义上的”函数“。
p5.js不仅仅提供一大堆可以直接用的”零件“，而且还提供了一个完整的可执行程序的模板，即设计了程序的基本结构，划分好了内部的各个功能模块和协作关联，其中一些模块的功能已经完成，另一些模块则是规定好了它与其它模块之间连接的规范。于是，在编程时就只需要按照它规定的模式，将为完工的模块开发完毕即可。也就是说p5.js本身就提供了一个可执行的程序，其中setup()和draw()函数是两个需要有编程者来完成的部分，它们在整个程序中的调用方式已经预先定好了。
上面观点的叙述，其实我是受到了一篇文章的启发，文章链接：https://blog.csdn.net/magicbrushlv/article/details/77840565
其实，如果想用编程的方法制作绘画系统，首先要对绘画有一个定义上的了解
我用不同的搜索软件搜索了绘画的解释：
百度百科的解释为：
绘画（Drawing 或Painting）在技术层面上，是一个以表面作为支撑面，再在其之上加上颜色的做法，那些表面可以是纸张或布，加颜色的工具可以通过画笔、也可以通过刷子、海绵或是布条等。在艺术用语的层面上，绘画的意义亦包含利用此艺术行为再加上图形、构图及其他美学方法去达到画家希望表达的概念及意思。
维基百科的解释为：
Painting is the practice of applying paint, pigment, color or other medium[1] to a solid surface (support base). The medium is commonly applied to the base with a brush, but other implements, such as knives, sponges, and airbrushes, can be used. The final work is also called a painting.
所以，有了对绘画的理解，再用自己的思维去论证与开拓，会容易很多
三.总结
通过这次开发绘画软件，我实现了自己的很多想法，通过人机交互的形式，实现了用编程绘画的功能，我个人偏向于用鼠标这种交互形式来作画，会比手绘更有灵活性。
开发过程中也遇到了很多问题，但是通过阅读很多文章和老师的指导，最后都成功解决了
最后，我想附上一篇我认为在理论思维上给我最大启发的文章链接：
https://blog.csdn.net/magicbrushlv/article/details/82634189