一、游戏情景描述
快过新年了，小金鼠奉金鼠奶奶之命要到集市上采购年货。由于第一次出远门，半路上遇到河流挡路，怎么办？原路返回？很可能会挨一顿埋怨，更主要是不甘心……聪明的小金鼠一眼瞥见河中来回飘荡的荷叶？这不是现成的摆渡小船吗？于是，小金鼠鼓足勇气，跳上了左右摇摆的“小船”。小船儿飘荡荡，荡飘飘；一不小心，就有落水的危险……
游戏玩家相当于游戏中的小金鼠，你需要借助河中来回飘荡的荷叶而摆渡，以完成从河滩出发点礁石到对岸礁石后上岸的艰巨任务。玩家需要根据自己功力的大小，先瞅准距离自己比较近的荷叶（同时也要留意荷叶移动的方向），然后跳到荷叶上，再跳跃到邻近的其他荷叶上……这样用智借力，躲闪腾挪……最后，才有可能顺利抵达河对岸。大胆，心细，并认真找窍门，将决定过河的成败！
相信每位小朋友都不会向困难低头，抓紧试试吧……
二、视频快照
先有目标才好动手，因此，还是先让我们来看一眼既定小目标的运行时视频吧：
00:58三、游戏角色、消息、变量设计
（一）角色设计
游戏共分为两个主要场景：游戏启动屏幕（也称为“菜单”屏幕）、游戏运行主屏幕。遗憾的是，时间所限，结局部分没有设计专门的屏幕，仅使用简单的音效及文字提示表达。1、游戏启动屏幕角色
其中，游戏启动屏幕如图所示：
游戏启动屏幕截图启动屏幕中的角色有：
河岸上的小金鼠音效开关开始游戏按钮上述角色设计中仅需要说明一点：为了增加游戏趣味性，河岸上的小金鼠使用了逐帧动画，这对系统渲染性能会带来一定影响。当然，像本文这种小游戏并不足为虑，对于大、中型企业游戏开发则是必须纳入考虑的重要因素之一。这两个小金鼠如下：
睁眼金鼠闭眼金鼠在内存极端受限的硬件环境，特别是移动设备上，精灵的尺寸及分辨率等都要纳入统筹考虑——一不小心，就有可能导致系统运行时崩溃。显然，上图中设计还是存在明显问题的：两个小金鼠绝大部分组成是一样的，只有眼睛动画部分存在差异。
为了减小内存占用，一种更优秀的方法是：把这两个造型中不变的部分统一到一个造型中，再把眼睛动画对应的两个小造型独立出来，共有三个造型，然后把眼睛动画对应的两个小造型使用动画技术播放。在很多HTML5动画（以及Cocos环境）开发中，还有一种常用办法是：类似于上面的技术，借助于二维骨骼动画引擎“组装”动画部件，然后纳入到开发工具中实现游戏动画。其最终目的都是为了从最大程度上节约内存开销。
建议有兴致的朋友，基于上面思想进行改进。
2、游戏主场景角色
接下来，看一下游戏主场景的设计，如图所示：
游戏主场景某一时刻快照主场景屏幕中的角色有：
过河金鼠荷叶精灵起跳礁石着陆礁石功力波浪声音按钮（也是启动屏幕中的精灵）值得注意的是，本游戏采用了顶视角（犹如站在高楼顶部往下看地面的情景）设计方案。这样一来，过河金鼠的造型只有一个（省略考虑起跳等动作相应角色）。另外，在此注意的一个细节是它的设计时的初始角度，见下图。
金鼠设计时的朝向如上图所示，在造型设计器中，根据左边的造型的方向，从右边“方向”参数处修改它的初始面向方向。由于默认情况下，Scratch中角色的面向方向都是90度，即向X轴正向（正东方向），所以，我们可以根据这个数据来从左边修改（主要是旋转）造型的图形朝向——这个朝向恰恰是我们的游戏中角色随着鼠标移动不断调整的方向（金鼠的面部朝向）。在我们游戏中，这个角色朝向是随着鼠标的移动而不断调整朝向的。根据这里的分析，如果想实现让金鼠的尾巴一直朝向鼠标方向，则上面造型中需要把左边造型的尾巴指向正东方向。
除了礁石和河水外，其他角色仅使用Scratch内置的角色编辑器即可完成，但是还是很麻烦的。在此强烈建议有兴趣的朋友学习一下Photoshop之类的图像编辑软件，以提高造型编辑质量与速度。
接下来，看一下两个简单角色的设计，如下图所示。
功力角色造型波浪角色造型其中，代表金鼠用力大小的功力角色使用一个虚线圆环描述。当金鼠不小心未踩上荷叶踏入河中时呈现的波浪角色使用简单的几个同心圆代表。在此，仅请留意一下这两个角色的中心点位置即可。
（二）消息设计
颇让人诟病的一个地方是，Scratch3.6中消息的管理效率一般。虽然消息机制是系统设计中各角色通讯的主要方式，但是很难纳入统一管理——例如，一个系统中定义了多少条消息很难一下观察到、消息内容无法再修改（只能重新定义），等等。
在此，为了管理方便，我们统一定义消息格式为“消息：XXX”。其中，“XXX”描述消息的内容。
在本游戏中，共定义了6条消息：
消息：启动屏幕——由舞台广播此消息给“启动屏幕”精灵，“启动屏幕”中的各精灵接收到此消息后会作好相应的准备；消息：游戏开始——启动屏幕中的开始按钮精灵广播此消息给所有游戏主屏幕中的有关精灵，并通知作好相应的准备；消息：起波浪——当金鼠不慎坠入河中时由过河金鼠广播此消息给“波浪”精灵，经处理后本回合游戏线束；消息：起跳——当玩家松开鼠标并且金鼠的功力在最大范围内时由“功力”精灵广播此消息给过河金鼠实现跳跃动作；消息：音效开关打开；消息：音效开关打开。下面，我们用思维导图描述一下本游戏中主要角色及其间的消息通讯关系：
游戏中主要角色及其间的消息接收为了简化绘制，上面图中省略了消息名称标注，并省略了启动屏幕精灵与启动金鼠精灵（启动屏幕中的起演示作用的精灵），并且未涉及到精灵间的碰撞关系。
在上面的关系图中，游戏自小绿旗点击启动，这是游戏的入口点。游戏的出口点（结束）有两处：一个是礁石精灵代码中——当金鼠跳上岸时游戏正常结束；一个是金鼠不慎坠入河中，掀起波浪翻涌——以失败而告终。
（三）变量定义
我们知道，Scratch中的变量分为两种作用区域（或者说作用空间）：一种是局部变量，仅限于当前精灵可见、可用；另一种是全局变量，为所有精灵可见、可用。
有关变量的使用方面，本游戏中遵循如下几点规定：
（1）能够局部定义的尽量定义为局部变量，从而减少对其他精灵的干扰；
（2）局部变量定义统一使用英文或者英文简写方式，前面以短下划线开头；
（3）全局变量定义也尽量使用英文或者英文简写方式，前面以英文字母
开头。在此仅介绍一下整个故事中定义的全局变量（其他的局部变量在后面代码分析时作适时介绍），共有4个，如下所示：
isPlaying：标记当前游戏所处的状态，这是一个布尔变量，当为1时表示主游戏正在运行中；当为0时说明游戏尚未正式开始（可能正处于启动屏幕状态或者已经结束）；jumping：描述金鼠是否正在起跳（至荷叶）。这是一个布尔变量，默认值为0，代表尚未跳起来；为1时表示正在跳跃中；power：代表金鼠拥有的功力大小，最小值（初始值）为0，最大值为45；soundOn：表示声效开关是否打开。四、各角色关键代码实现（一）舞台编程
舞台代码是整个故事初始化准备，及全局广播消息收、管处理（部分）的重要位置。
绿旗点击初始化全局变量并广播启动消息接到消息时的必要初始处理相信朋友们不难理解上面的代码。其中，第二部分代码中，实现接收到相应消息后作两个场景下的游戏背景音乐的音效处理。
（二）启动屏幕及主要角色编程
在本游戏的编程中，启动屏幕（也称菜单屏幕）是使用一个前台普通精灵实现的，另一种实现类似简单的游戏启动屏幕的办法是把部分设计直接在舞台的背景造型中设计。但是，复杂游戏的启动屏幕的设计还是建议使用本文方案更有助于代码的简化与管理。
启动屏幕精灵代码启动屏幕精灵代码比较简单。只是有一个结论需明确：舞台造型这一层总会位于整个场景的最底一层。这里的99是一个大约数，即尽量把这个层往底层放，而游戏即将正式开始时，这个层是要隐藏的。
音效开关精灵代码上面的音效开关相应编码在以前的有关教程（Scratch3.6开发简易版《水果忍者》（终结篇））中已经使用过，在此不再赘述。
启动屏幕中的金鼠精灵代码本游戏设计的启动屏幕中提供了一个金鼠精灵，为了增加界面的趣味性。当然，这里的设计可谓过于简单——正式的商业游戏软件开发中这几乎是不允许的，因为在以前的文章中我强调过：游戏界面本身的有趣与可玩性是吸引玩家的重要因素之一，是绝不容忽视的开发要素。
开始按钮wad这里的按钮代码也很简单。当点击此按钮时，把全局变量
isPlaying的值设置为1，指示游戏已经正式开始运行，并广播相应的消息。网络上有文章说，Scratch编程中全局变量与消息作用相同，这个结论是不合适的。全局变量可以为舞台上所有角色操作使用，例如可以修改它们的值，应用于条件判断中，甚至可以用来存储特定的消息。尽管变量与消息有相似的作用，但是消息的接收可以被当作可执行代码的开始，例如类指令组中的积木。但是，变量就没有这种能力。另外，Scratch中的消息广播机制，从软件开发模式理论来看，属于观察者模式中的推送方式，还有另外一些优点。有兴趣与软件开发基础的朋友可以在网络上进一步搜索这方面的话题，在此恕不赘述。
（三）游戏主屏幕及主要角色编程
当玩家点击启动屏幕中的按钮后，便正式开始游戏。当然，我们的设计极其简单——只是一个单关卡（过河就算成功）游戏，而且怪物设计也很少——只有一个，如果说有的话，就是荷叶——可以坐着荷叶渡河，也有可能，坐不上去的话，掉到河中。
1、礁石精灵代码
游戏中引入了两个礁石精灵，一个对应于起跳礁石，另一个对应于着陆礁石。其代码非常简单，如下所示：
礁石精灵代码2、过河金鼠代码
当接收到游戏开始时对应代码当接收到起跳消息时的代码过河金鼠代码其实有三段。当小旗点击后，其私有变量
origMouseX和origMouseY被初始化为起跳礁石所在坐标值，同时隐藏自身。接下来，让我们