Skip to content

Scratch 简明教程

2011/08/03

第一章 认识 Scratch

      从今天开始,我们将会给大家介绍美国麻省理工学院(MIT)开发的一种适合于普通人学习和体验动画、游戏设计和程序设计的软件 Scratch 。经过一段时间的学习,你会感觉到,程序设计并不是少数人的“专利”。你的创意通过 Scratch 来展示的确是一个不错的主意。

      使用Scratch 进行创作而产生的作品,不是一般意义上的制作卡通动画,而是一种受指令控制的动画,它的主要特点是交互性。在制作一种具有电脑游戏的交互特征的小故事、小幽默、小游戏等作品的过程中,它更强调设计者对各类指令的使用,强调脚本对剧情以及细节表达的控制。

第一节  角色及其的属性

      Scratch 角色就是你的作品要表现的人或物。Scratch 角色有三种属性:脚本、造型、声音。其中,脚本是角色灵魂。造型表达角色的外观;声音从听觉上来表现角色。角色造型和声音均受角色脚本的控制。

      Scratch 工作区右侧下部是“角色区”,在这里放置着当前作品中需要用到的角色。

      Scratch 工作界面中间的一块区域是角色属性设置区。上部有“脚本”“造型”“声音”三个标签供选择。当你右下方的“角色区”选择了一个角色后,再点击这三个标签其中之一,就可以对其进行设置了。

第二节 角色活动的场所–舞台

    界面2

     程序窗口的右上方的一块矩形区是舞,它是角色活动的场所。舞台有三种大小不同的视图。最大的视图布满整个屏幕。点击舞台右上角三个并排的按钮可以进行舞台视图的切换。

舞台尺寸及坐标系统如下图所示:

舞台尺寸

 

第三节 角色活动的指挥者–脚本

      脚本又称控制代码,有时也统称为程序,它是由一条条的指令组织起来的,它是角色活动的指挥者。指令是构成脚本的“材料”。学习使用Scratch 创作作品,中心任务就是使用这些“材料”来“构建”脚本这部可以运行的“机器”。

      Scratch 指令包括指令关键词参和指令参数。指令关键词决定指令要做什么。指令参数是告诉机器在执行时的前提条件和具体要求,是回答执行方“具备什么条件才做?”,“做到什么程度?”的问题。指令关键词是指令中不可变的部分。而指令参数则随着具体问题的不同而不同。

第四节 编辑脚本–搭积木

Scratch 编辑脚本的方式不同于其它程序设计语言指令编辑的方式。

这种特殊编辑过程可以这样来描述:
      将合适的指令块从左侧指令区中“取出”,放置到脚本区中已经存在的脚本的附近。这时,已经存在的脚本具有“磁性吸附”能力,会把这个指令块吸上去,让它成为脚本的新成员和组成部分。当然,不是随意拖一个指令块放过来都行。脚本本身具有“识别”和“拒收”不合理成员的能力。只有符合要求的指令块才能被吸收进来。
      怎样做到每次放入的新成员是合理的呢?这个也很容易做到,从指令块的形状上来判别。这就象儿童玩搭积木的游戏一样,形状不合适的积木块是堆积不上去的。形状明显不“匹配”的指令块,就不要徒劳地想添加到脚本上去了!

      在编辑脚本中还有一项重要工作,就是确定指令中的条件项和参数。条件项和参数要根据角色在舞台中的具体状态和位置来确定。比如,角色运动时位置的限制范围,角色相遇的条件等等。

第五节 指令的分类

Scratch 指令分为8类。通过点击左侧上部的指令分类按钮来查看每一类型的指令。不同类型的指令通过颜色可以显著地区分开。

控制 动作 外观 侦测 数字和逻辑运算 声音 变量 画笔

Scratch 指令块按其形状,以及在脚本中的位置分成以下五类:

头块
形状特征:面积比较大,上边呈现波浪状的控制类指令。
它们必须放置在脚本段的最前面。每段脚本必须用这四者中的一个打头,才能正确激活运行。

 1-1

搭接块
特征描述:上边有凹陷的缺口,下边有凸起部分,以便与其它指令块连接时吻合。
使用方法:搭接

1-5

终止块
特征描述:上边有凹陷的缺口,但下边没有凸起部分。终止块后面不能再搭接指令块。
使用方法:搭接

1-3

条件块
特征描述:两端是尖角状。不能单独起作用,只能嵌入到有条件要求的指令块中使用。
使用方法:嵌入

1-4

参数块
特征描述:两端是圆弧状。不能单独起作用,只能嵌入到其它指令块的参数框中使用
使用方法: 嵌入

1-2

 

第二章    小猫的故事

在这一章里我们要学习使用 Scratch 描述小猫生活的四个小场景,也就是四个实例。

 

第一节  场景一:和小猫对话

现在让我们来做第一个作品。

舞台 系统默认

角色 系统默认

脚本 切换到脚本区编辑
          在脚本操作表达中,作如下约定:
          […]搭接块
          (…)参数块
          <…>条件块

      1.      控制 >>> [当“绿旗”被点击]
      2.      外观 >>> [说(你好!)(2)秒]
      3.      侦测 >>> [询问(我叫米特,你的名字是?)并等待]
      4.      侦测 >>> [询问(…)并等待]
               运算 >>> (将(…)加到(,我们能成为好朋友吗?)后面)  //将本块拖放到上一行(…)处
               侦测 >>> (回答)  //将本块拖放到上一行(…)处

下面是脚本区截图,大家可以与上面文字表达的脚本相对照。

2-1

通过这个实例我们注意理解以下几点:
1.除了第1行指令没有参数之外,其余3行指令均有参数。第4行参数最为复杂。
2.第4行参数是由“数字和逻辑运算” 类型的参数块嵌入的。“
3.将…”后的第一个参数又是侦测类的参数块“回答”嵌入的。
4.这里的“回答”的具体内容是操作者用键盘输入来应答第一句询问的内容。

第二节  角色在舞台上的定位方法

     添加动作类指令,改变角色位置或者让角色移动到某一点时,有时需要指定角色在舞台上的起始和终止位置。在 Scratch 中,用角色的中心点代表角色,角色的位置就用角色中心点在舞台上的坐标值来表示。
     选择某个角色,点击“动作”打开动作类指令块。点击“x坐标”“y坐标”指令前面的选择框,让它们为选中状态。这时,在舞台左上角出现两个灰色的长条,用鼠标拖动角色,你会发现,灰色长条后面的数字在变化。这里的数据,就是角色的位置坐标值。再次点击左侧指令区的“x坐标”“y坐标”前面的选择框,上面的对钩消失,舞台左上角的灰色长条也不显示了。
      当我们需要在指令块方框中填写角色的位置坐标值时,一般需要先让“x坐标”“y坐标”在舞台上显示出来,然后用鼠标将角色拖动到希望的位置停下来,记录左上角显示的坐标值,并将此坐标值填入相应的指令块的参数格中。(演示)    

由于角色在舞台上的位置与指令执行的结果有关,同时无论脚本是否在运行,都可以用鼠标拖放角色来移动它。所以为了保证角色在重新执行脚本时有一个正确的起始位置,通常需要使用上面的方法确定角色的初始位置。
在设置角色坐标位置时,还要注意舞台的坐标值范围。(参见第一章)
水平坐标范围(可视):-240~240
垂直坐标范围(可视):-180~180
 

第三节 “重复”指令和“如果”指令

     控制类指令当中有两类指令很重要。一类是“重复…”执行指令,另一类是“如果…”执行指令。角色造型切换动画的形成中,就需要使用重复指令。在需要响应键盘、鼠标事件的游戏的脚本中也需要用到这两种类型的控制指令。
“重复…”类型的指令用于需要反复执行的指令(指令段)。
“如果…”类型的指令用于根据条件满足的情况决定是否执行指令。

重复如果

 

      重复类、如果类指令提供的是指令执行的框架,它必须和其它指令块组合起来,才能构成有实际意义的动作。上面除条件等待指令块(如果类标号3)之外,其它指令块的形状都被设计成向右开口的“半开口”状就是这个道理。这个框架的尺寸是“弹性”的。其开口的大小,容纳其它指令块数量是可变的。

      重复类的指令块的右下角有一个“弯弯的箭头”,表示重复执行的意思。如果类的指令块没有这个箭头,即使能够执行,也只执行一次。

标号1重复指令块重复执行不需要条件。
标号2重复指令只重复指定的次数。
标号3重复指令只在条件满足时重复执行。
标号4重复指令在条件满足时终止重复。
标号1如果指令在条件不满足时不执行。
标号2如果指令在条件不满足时也有指定的指令要执行。
标号3如果指令条件满足时才停止等待。

标号3重复指令虽然是以“如果”开头,但注意它不是“如果…”类。

以上指令将在后面的实例中会多次地使用。请在使用中注意体会这些指令的特点。

 

第四节  场景二:小猫喜欢什么?

情节描述:在桌子上放有三件东西,不知道小猫究竟最喜欢的是什么?
如果你也不能确定的话,表在点击“绿旗”后,用鼠标拖动每一件送给小猫,她会告诉你的。

制作过程:

1.将小猫定位到舞台左下角。

直接鼠标拖动。

2.在舞台右侧绘制一个矩形方框

在角色区点击选择舞台角色,在角色属性区点击“多个背景”标签,再点击“编辑”按钮,开始绘制舞台元素。

点击绘制长方形工具,然后再点击空心长方形按钮,点选橙黄色,在绘图区右侧绘制一个长方形。

Snap33
 

3.从角色文件夹中导入三个新角色,调整它们的大小和位置。操作演示

前三步做完后的舞台如图所示

2-2

4.分别设置小猫,和其它三个角色的脚本并调试脚本。操作演示(角色1脚本)

2-3

 

 

第五节  场景三:和小狗比赛(演示下载)

 

情节描述:小猫和小狗比赛跑,谁是取后的胜者?

制作过程:

1.制作跑道

在角色区点击选择舞台角色,在角色属性区点击“多个背景”标签,再点击“编辑”按钮,开始绘制舞台元素。

点击线条工具,选择笔刷大小为最粗型,选择深灰颜色,在舞台上绘制一个“Z”字型。
再点击白色,换取较细笔刷,再上面再绘制一条“Z”。
在起跑处画出一条白色起跑线。
换取红色,在终点处绘制一条终点线
绘制后的舞台如图所示。

2.初始化角色

调整小猫大小,拖动至起跑处。
点击“脚本”,点击动作类指令按钮,点击“x坐标”“y坐标”,在舞台上显示出角色位置坐标值。拖动“[移到 x:(…)y:(…)]”到脚本区。让指令参数与舞台显示的坐标值相同。

导入小狗角色,调整大小与小猫相当,拖动到起跑处。点击动作类指令按钮,点击“x坐标”“y坐标”,在舞台上显示出角色位置坐标值。拖动“[移到 x:(…)y:(…)]”到脚本区。让指令参数与舞台显示的坐标值相同。

2-5

3.设计脚本

比赛过程脚本编辑

将比赛道路分成三段。每一段都使用“定时移动”指令块:[在(…)秒内,平滑移动到 x:(…)y:(…)]。先移动角色到每段的终了处,查看显示出的x,y坐标值,再将坐标值填入指令相应参数位置。(参考本章第二节的说明)在每第一个和第二个定时移动指令后面,分别加入一个换向指令:[面向(-90)方向],[面向(90)方向]。在每个角色属性区上方点击第二个按钮,“只允许左、右翻转”。

终点撞线脚本编辑

使用“如果”框架。条件是:(碰到颜色(红色))

2-6

不同制作者,放置角色的位置是不同的(x,y坐标),所以,上面脚本中角色位置参数,时间参数(秒数)只供参考。各段的秒数值越大,角色跑得就越慢。

 

第六节 造型切换动画

在前面第五节“和小狗比赛”场景中,我们看到的小猫和小狗是在移动,而不是在跑步。如果我们要得到跑步的效果,就要让几个跑步的造型反重复切换。

造型是捕捉某一瞬间角色动作。在制作Scratch作品中,要根据角色动作表现的需要,导入一定数据的造型到属性区。然后,在适当的时候使用造型切换指令,才能获得想得到的动画效果。

一个新的 Scratch 角色在导入角色区之后只有一个造型(Scratch启动画面除外)。制作者可以从以下几种途径获得角色的其它造型:

1.从scratch角色造型文件夹中(软件自带有一定数据的角色及及造型),通过“导入”的方法添加。

2.使用scratch绘画工具,在原有造型的基础上进行编辑修改,生成新的造型。

3.使用第三方绘画工具绘制后,导入到scratch作品中。因为scratch绘画工具只能做一些简单的编辑变换,如果造型变化的幅度比较大,就要使用功能更为强大的绘画编辑工具。

下面,我们做一个造型切换动画的片段。

制作过程:

一、导入新角色、新造型。

1.启动scratch软件,删除默认角色。

选择角色区小猫角色,右击,在弹出的菜单中选择“删除”。这样默认的小猫的角色和造型就没有了。

2.导入新角色。

点击角色区中的“导入”按钮,打开animal 文件夹,选择“dog2–b”。

3.使用scratch绘画工具编辑造型。

在属性区点击“造型”,点击“编辑”按钮启动scratch绘画工具。

点击填色工具,吸取黄色后,在小狗的蓝色处点击,将蓝狗变成黄狗。

点击“确定”返回造型属性界面。

4.导入小狗的另一个造型。

点击“新增造型”后面的“导入”按钮。打开animal 文件夹,选择“dog2–c”。

点击“确定”返回造型属性界面。这样,增加了小狗的另一个造型。

用上面相同的方法,将蓝狗变成黄狗。

二、使用脚本控制造型切换。

1.在属性区点击“脚本”标签,切换到脚本编辑界面。

2. 使用下列指令块及参数:

外观 >>> [切换造型到(dog2-c)]
控制 >>> [等待(0.5)秒]
外观 >>> [切换造型到(dog2-b)]
控制 >>> [等待(0.5)]

3.加入重复动作指令。

控制 >>> [重复执行]
外观 >>> [切换造型到(dog2-c)]
控制 >>> [等待(0.5)秒]
外观 >>> [切换造型到(dog2-b)]
控制 >>> [等待(0.5)]
======重复结束

4.加入执行脚本的绿旗指令块,调试并运行。演示下载

2-7

 

第七节 场景四:走过来的小猫

 

 

 

 

Advertisements

From → Scratch 专区

发表评论

发表评论

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 更改 )

Twitter picture

You are commenting using your Twitter account. Log Out / 更改 )

Facebook photo

You are commenting using your Facebook account. Log Out / 更改 )

Google+ photo

You are commenting using your Google+ account. Log Out / 更改 )

Connecting to %s

%d 博主赞过: