计算机 1 ( 显示数字 )

这篇文章会介绍，在 Scratch 里使用函数、分身、变数、广播消息、逻辑判断、变换造型...等积木，实作一个计算机的外型，并在点击计算机按钮时，会出现点击的数字和加减乘除的符号。

相关文章参考：函数、分身、变数、广播消息、逻辑判断、变换造型。

角色设定

在角色编辑区，删除猫咪的角色，使用绘画，绘制新角色 ( 参考：造型与绘图 )。

新增第一个角色“按键”，使用“方形”工具在画布中画出一个正方形，对齐画布中心，使用“文字工具”在正方形中间写上数字，字型选择 Pixel。

重复同样的步骤，依序建立：2、3、+、4、5、6、-、7、8、9、x、0、=、AC、÷ 共十六个造型 ( 注意，顺序不能有错 )。

注意！请按照下图进行命名，+ (s1)、- (s2)、x (s3)、÷ (s4)、= (s0)、AC (sc)。

新增第二个角色“数字”，使用“文字工具”在正方形中间写上数字，字型选择 Pixel，位置先对齐画布中心 ( 因为数字间距的关系，待会会再调整 )。

重复同样的步骤，建立 2、3、4、5、6、7、8、9、0、-、. 共十二个造型 ( 按照下图命名 -、. )。

新增第三个角色“符号”，重复上述的步骤，建立 +、-、x、÷ 共四个造型，作为显示按了哪个加减乘除符号使用 ( 按照下图命名 s1、s2、s3、s4 )。

积木程序原理 ( 按键 )

点击“按键”角色，设定点击绿旗的程序：

• 定位到 (-100, 60) 的位置 ( 按照个人状况做定位 )。
• 造型换成 1。
• 尺寸设定为 80% ( 按照个人状况调整 )。
• 隐藏本尊。
• 新增 icon 和 num 两个变数，设定为 0。

从左侧积木清单，新增一个名为“分身”的函数，勾选“执行完毕再更新画面”。

在点击绿旗的最下方，执行分身函数，放入“当分身产生”积木，产生分身后显示分身，接着编辑分身函数：

• 使用一个重复 4 次积木包着另外一个重复 4 次积木 ( 总共 16 次 )。
• 内层的重复 4 次积木每次重复时，建立自己的分身，并将位置往右边移动。
• 外层的重复 4 次积木，每次重复时，将位置移动到左侧，并往下移动。
• 广播 input 消息 ( 让数字角色接收并显示数字 )。

完成后，点击绿旗，舞台上就会出现计算机的样子 ( 位置可以按照个人状况调整重复积木里的数值 )。

编辑当分身产生的程序：

• 使用重复无限次积木，每次重复判断“鼠标是否点击按键”( 碰到鼠标且鼠标按下 )
• 如果按键被点击，接着判断如果按键造型名称里有“s”，表示按压的是 +、-、x、÷、=、AC。
  • 将变数 icon 设为造型名称。
  • 发送“显示符号”消息。
• 如果按键造型名称里没有“s”，表示按压的是数字键：
  • 如果 num 为 0，就将 num 设定为造型名称 ( 开头才不会有 0 )。
  • 如果 num 不为 0，将 num 组合目前的造型名称。
  • 发送“input”消息。
• 等待直到放开鼠标 ( 按下鼠标不成立 )，再进行下一次重复。

积木程序原理 ( 符号 )

点击“符号”角色，设定相关动作：

• 点击绿旗时，隐藏角色，并将位置定位到计算机的左上方。
• 新增一个名为“显示符号”的函数：
  • 显示角色。
  • 更换造型为 icon 变数的数值。
• 收到“显示符号”消息：
  • 隐藏角色。
  • 如果判断是加减乘除的符号，就执行“显示符号”函数。

积木程序原理 ( 数字 )

点击“数字”角色，新增一个“显示数字”函数，勾选“执行完毕再更新画面”。

设定点击绿旗和收到 input 消息的动作：

• 当绿旗被点击：
  • 隐藏数字角色 ( 待会会用分身显示 )。
  • 新增 input 和 n 变数，设定为 0。
• 当收到 input 消息：
  • 设定 input 为 1。
  • 等待直到 n 等于 0 再继续。
  • 定位到计算机的左上方 (-100, 130)。
  • 将 input 设为 0。
  • 执行“显示数字”函数。

设定显示数字函数和建立分身的动作：

• 显示数字函数：
  • 使用重复积木，重复的次数等于 num 的字串长度 ( 例如 123 的长度为 3 )。
  • 每次重复将 n 增加 1。
  • 将造型换成 num 的第 n 个字。
  • 建立分身，往右移动。
• 当分身产生：
  • 显示分身。
  • 等待直到 input 等于 1 ( 表示又按下了数字按键 )。
  • 将变数 n 减少 1。
  • 删除分身。

n 的数值表示现在有几个分身，当收到消息后，会先将画面的分身清空 ( n=0 ) 再继续。

完成结果

完成后，点击绿旗，用鼠标点击计算机按键，就会出现对应的数字和符号 ( 还没有计算功能 )。

范例解答

范例解答：计算机 1 ( 显示数字 )

继续阅读

如果已经熟悉了计算机 1 ( 显示数字 )，就可以继续阅读“计算机 2 ( 加减乘除 )”的文章。

文章链接：计算机 2 ( 加减乘除 )

意见反馈