跑完2000步，卡卡汗流浃背，不过似乎又找回了那种身轻如燕的感觉。
与此同时，系统切换了场景，卡卡发现自己在一片森林的边缘。一条小河从森林里流出来，挡住了去路。
“这是永恒之河，代表时间的流动”，AI助手提示，“水很深，你必须踩在河面上的目标之靶上才能通过”。
卡卡发现河面上确实漂浮着箭靶一样的物体，一直延伸到对岸。他试着跳上去，稍微有点晃动，但感觉还能承受自己的重量，他开始寻找下一个落脚点。
“远大的目标不是一蹴而就的，必须先分解成一个个的阶段目标，专注当前位置，紧盯下一个目标，才不会随波逐流”，AI助手友好地说，“请小心脚下”。
“对极了”，卡卡说着跳到下一个落脚点，”看我的！“。
学习目标
- 了解 Scratch 提供的绘图，使用绘图编辑器绘制简单的角色造型；
- 掌握 Scratch 舞台的坐标系统，理解通过设置X、Y坐标对角色进行舞台定位的方法。
编程实战
本节我们编写程序，为小猫加上“立定跳远”的技能。
第一步：场景与角色布置
新建一个Scratch 3.0项目。这个作品除了默认的小猫卡卡之外，我们需要若干个“箭靶”（代表目标）角色，这个是 Scratch 中没有的。怎么办呢？自己动手，丰衣足食，我们要请出本节的主角——绘图编辑器了。
还记得添加角色的方式吗？在角色列表区右下角有一个小猫头按钮，将鼠标移动到按钮上，会弹出一个新角色菜单（不要直接点击，那样会进入默认角色库）：
01 绘制角色菜单
在此菜单中点击画笔图标，就会进入绘图编辑器：
02 绘图编辑器界面
这其实也就是角色的“造型”标签的内容，不过由于是自己绘制角色，Scratch 为我们新建了一个空的“造型1”。如果你在现有的角色上打开造型标签，则会显示该角色的所有造型，你可以进行修改。Scratch 自带的这个绘图编辑器虽然功能不多，但足够我们发挥创意了，我们将在以后的学习中，逐步发现它的强大之处。
现在，面对空空荡荡的画布，你是不是有些迷茫，不知道怎么下笔呢？别担心，任何复杂的造型都是由最基本的形状构成的，我们从最简单的做起，一步一步来。
首先，你需要注意画布中心那个灰色的小圆点（仔细看，不太明显），这个是我们要绘制造型的“中心点”，在后面的课程学习中，如果要计算角色的准确位置，就是以中心点所在位置为准，如果角色要旋转，也是基于中心点旋转。不理解这一点也没关系，你只要知道造型中心点是在这里，用到的时候自然知道到这个位置来寻找即可。
在功能菜单区有“填充”和“轮廓”两个下拉式的菜单，点击它们右侧的向下箭头就可以选择颜色。这里我选择填充色为白色（拖动滑块，颜色和饱和度的滑块向左到0，亮度向右到100就是白色）、轮廓为红色（颜色0，饱和度100，亮度100），轮廓后面的那个数字是粗细，设置为25，然后在绘图工具区选择绘制圆形的工具，用鼠标在绘图区域拖动，画出一个扁扁的椭圆：
03 绘图步骤1
用相同的方法再画一个大小差不多的椭圆，但是轮廓和填充都是白色：
04 绘图步骤2
在绘图工具区选择箭头工具，然后用鼠标拖动刚刚画好的白色椭圆，将它“移动”到红框椭圆的上方，但不要完全盖住，这样就形成了一个带有立体感的圆盘。此时你会注意到椭圆四周出现了一个方框和八个圆点，如果图形的大小不合适，拖动这些圆点就可以调节形状大小：
05 绘图步骤3
再画一个小一点的红色椭圆，放在白色椭圆中心位置：
06 绘图步骤4
最后画一个最小的黄色椭圆放在红色椭圆中心，一个平放的箭靶就基本上画好了。如果觉得形状不满意，你可以用移动工具选中它之后进行调整。注意这些圆的中心与我们前面所说的“造型中心点”要基本重合。
07 绘图步骤5
最后，在角色属性中将画好的角色大小设置为50，用鼠标右键点击这个角色，再点击“复制”，舞台上就会出现一个一模一样的箭靶。把它们的位置按照图中的方式排列好，再把小猫拖动到第一个箭靶上，场景初步布置完成。
08 场景布置完成
第二步：使用坐标定位角色
接下来我们需要编写代码，让卡卡先从第一个箭靶上跳到第二个箭靶上，然后再跳到第三个箭靶上。
上一节我们学习了使用移动步数的方式让小猫动起来，这次我们要实现的是“跳”，不能沿着一条线“走”过去。这就要用到X、Y坐标定位。
什么是X、Y坐标定位？ 举个例子，你和爸爸妈妈一起开车出去，是不是经常会用到导航软件？只要输入目的地位置，导航软件就会计算出一条到达目的地的最佳路线，而且开车过程中还会在地图上显示你当前的位置。软件怎么知道我在地图上什么位置呢？
地图上的任意一个点都是由经度、纬度决定的，东西方向是经度，南北方向是纬度。你手机中GPS芯片会与卫星通信确定当前位置的经纬度，软件用这个经纬度把你的位置显示在地图上，这就叫坐标定位。
那么 Scratch 中的坐标是什么样的呢？要想了解清楚，你可以通过角色列表区右下方的选择一个背景按钮，从 Scratch 3.0 自带的背景库中找到一个叫“Xy-grid的背景”并确认，你会发现舞台区变成了这个样子：
09 XY坐标系
原来，和经纬度相似的是，Scratch 中的坐标是用X、Y两个数据组成的。横向的数值是X，从左向右为-240到240，中间为0，纵向的数值是Y，从下向上为-180增加到180，中间为0。这样，X=0、Y=0的坐标就是舞台的正中心位置，可以表示为（0，0），括号内第一个数字是X的值，第二个数字为Y的值。
相应地，小猫卡卡和我们自己绘制的角色在舞台上的位置都可以用它们的X、Y坐标来定位。我们要修改它的位置，只需要设置它的X、Y值就可以。现在你知道属性列表区上方的X、Y是干什么的了，而且为什么在小猫走动的时候X值会来回变化了。
从角色属性中，你会看到小猫的当前位置是（-155，-89），现在把小猫拖动到第二个靶盘上，会发现它的坐标变成了（-9，-61）：
10 移动后的坐标
此时，你可以在运动类指令区找到一条指令，在1秒内滑行到-9,-61。把它拖动到代码区，再把小猫拖动到原来位置，点击执行这条指令，就会发现小猫很快移动到了第二个靶盘上，这就是快速设置X、Y坐标的方法。运动指令区还有一些其它与X、Y坐标相关的指令，比如增加X、Y坐标，分别设置X、Y坐标的值等等，你都可以试试。运动指令区还有两个特殊的指令，它们是椭圆形的，不能执行，但是是两个保存X、Y值的变量。只要用鼠标选中它们前面的对勾，舞台上就会显示出当前这个角色的X、Y坐标值。
11 显示XY坐标
显然，直接用“滑行到X、Y”坐标，小猫的样子还是移动，不是“跳”，我们可以改进一下代码，小猫在跳起的过程中会先向右上方移动一点，到图中所示的位置，然后再移动到第二个靶盘上。我们可以再拖动一条滑行指令过来，与刚才的滑行指令结合在一起，然后把小猫拖动到第一个靶盘，点击执行：
12 小猫跳起的位置
小猫的动作确实像“跳”了，但感觉特别慢。我们可以把指令前面的“1”秒这个数值修改小一点，改为0.5，为了方便，再在前面加一条“移到X、Y坐标”的指令（它与滑行指令的区别就是瞬间移动，你看不到移动的过程），这样每次点击指令，小猫都会从第一个靶盘跳跃到第二个靶盘上，动作也相对自然一些了：
13 小猫跳动指令修改
用这种方法，你还可以再增加代码，让小猫从第二个靶盘跳到第三个靶盘上。注意刚刚提到的技巧，当你把小猫拖到某个位置时，指令区的滑行指令数值就会设置为小猫当前位置的坐标，这时再拖动滑行指令就不需要修改X、Y值了，非常方便：
13 小猫跳动指令修改2
最后我们再完善一下代码，在两次靶盘跳跃中间增加一个等待指令，最前面加上绿旗执行指令：
14 小猫代码完善
第三步：加上背景图
代码编写完成，你也掌握了X、Y坐标的用法，再用Xy-grid这个背景就不合适了。打开 Scratch 内置的背景库，将背景设置为Water and Rocks，我们使用它代表故事中的“永恒之河”（未来你还会掌握如何寻找更合适的背景素材并导入到 Scratch的方法），这个作品就很有场景感了。
现在每次点击绿旗运行程序，小猫都会先“复位”到河流中的第一个靶盘位置，再依次跳到第二、第三个靶盘上，本节程序完成。
15 作品完成
指令小贴示
- 移到【X】【Y】：对角色直接定位，指定一个X、Y坐标构成的位置，角色会马上移动到这里，你几乎看不到过程，一般用于在程序开始时对角色设定初始位置；
- 在【X】秒内滑行到【X】【Y】：使用这个指令，你会看到角色在指定的时间内“滑”到指定的位置，这是制作动画的一种方式。
课后思考
X、Y坐标构成的定位系统非常灵活，你可以直接控制角色在指定的时间内出现在舞台的任何位置，而不用让角色“行走”，这为角色提供了很大的自由度，是我们编写各类程序，尤其是游戏类小程序必需掌握的，请多练习几次。
本节通过使用滑动指令，我们模拟了小猫跳跃的过程，但它的动作多少还有些生硬。你能在它跳跃的过程中再增加一些滑动指令，让小猫跳动的指令更加“平滑”一些吗？
网友评论