20.画图板

本章我们实现的功能是一个画图板，移动鼠标时就会有一根铅笔跟着鼠标指针移动；按住鼠标左键时，在铅笔移动的路径上就会留下相应的痕迹；在整个画图板的旁边还有一个选择块，我们可以选择红、绿、蓝3种颜色；另外还有一个“清除”按钮，按下这个按钮，整个画图板就会被全部清空。

我们还是先从角色入手，在角色库中选择一个铅笔角色“Pencil”，铅笔要跟着鼠标指针移动，所以程序方面要让铅笔角色一直移到鼠标指针的位置，如图20-1所示。

图20-1 铅笔角色跟随鼠标指针移动的程序

点击 运行一下程序，此时铅笔就会一直跟着鼠标指针移动，不过大家可能会发现，此时鼠标指针的位置是在铅笔中间，而我们希望鼠标指针的位置在笔尖，所以在“造型”选项卡中要调整一下角色造型的中心点位置，如图20-2所示。将笔尖放在十字的中心上，此时再运行程序，鼠标指针的位置就在笔尖了。接着我们要让鼠标左键被按住时能够在铅笔运动的轨迹上留下痕迹，这要用到画笔中的“落笔”和“抬笔”指令模块了。按下鼠标左键时落笔，否则抬笔。

图20-2 调整铅笔角色中心点位置

完成后程序如图20-3所示。

图20-3 添加“落笔”和“抬笔”指令模块

单击“全屏模式”测试一下画笔功能，当我们按住鼠标左键移动时，就能在舞台区用铅笔画出线条了，如图20-4所示。

图20-4 程序运行效果

现在我写了一个“Scratch”的字样，不过只能一直在舞台区上画，如果画错也没办法调整，这就需要我们添加一个清除按钮。选择一个按钮角色“Button2”，在角色上写上“clear”字样，如图20-5所示。

图20-5 添加清除按钮

清除按钮角色的程序用到了“事件”分类中的“当角色被点击”指令模块，紧接着的操作是“画笔”分类中的“全部擦除”指令模块，程序如图20-6所示。当程序运行时，单击清除按钮，整个屏幕就被清空了。

图20-6 清除按钮角色的程序
接着我们来调整画笔的颜色，添加一个按钮角色“Button3”，调整其颜色为红色，如图20-7所示。

图20-7 添加红色按钮

将按钮摆放在合适的位置，添加程序。这里要注意，每个角色都有一个画笔的属性，我们在角色内改变画笔的属性只是改变这个角色的画笔状态，比如红色按钮的程序中，我们直接修改画笔的颜色，实际上改变的是红色按钮的画笔的颜色，然后在落笔时我们使用的是铅笔角色的画笔的颜色。所以红色按钮角色的程序中，当红色按钮被单击时要广播一个消息，消息的内容是“red”，程序如图20-8所示。

图20-8 红色按钮角色的程序

对应地，在铅笔角色的程序中，接收到消息“red”之后将画笔的颜色设为红色，如图20-9所示。

图20-9 铅笔角角色接收到消息“red”后改变画笔颜色的程序

按照相同的方式，我们再添加绿色按钮、蓝色按钮和黑色按钮，将所有按钮的大小修改为40，完成后效果如图20-10所示。我们用这几种颜色画了一副超级简单的画。当我们画太阳时，可能会想到Scratch中的画笔粗细是不是也可以调整。我们打开“画笔”分类，能看到其中有一个“将笔的粗细设为1”指令模块，这个应该能够用得上。为了在屏幕上直观看到画笔的粗细，我们创建一个变量“size”。

图20-10 添加更多的颜色按钮

在程序中通过键盘“↑”键和“↓”键调整画笔的粗细。整个画图板项目完成后，铅笔角色的程序如图20-11所示。

图20-11 铅笔角色的最终程序

本节知识点：

1. 学会广播的应用：设置画笔颜色。

2. 学会变量的应用：修改画笔粗细。

扩展练习：

1. 加入橡皮擦功能。

2. 加入画线段、矩形、圆形功能。