BPI-STEAM 用户文档

BPI-STEAM 是专注于软硬件开源技术的开源组织,属于 Banana-Pi 的分支,从 2018 年起推出 BPI-BIT 开发板,随之推出 Webduino 、 MicroPython 、 Arduino 等开源技术支持,通过用户文档能够让用户轻松入门 BPI-STEAM 所提供的技术产品。

提示

本文档托管于 BPI-STEAM 开源组织。

认识 BPI-BIT 开发板

BPI-BIT 是一款基于 ESP32 高性能芯片且兼容 micro:bit 设计的开源 STEAM 教育开发板,又名 Bpi:Bit、Web:Bit 。

_images/bit.png

开发板介绍

以下内容介绍硬件 1.4 版,编辑日期 2019年7月24日。

Bpi:Bit 又名 Web:Bit ,是 Webduino 的专用开发板,采用 ESP-WROOM-32 (ESP32)模组作为核心,拥有 Wi-Fi & Bluetooth 无线功能,支持多设备协同控制,更是内置了许多的传感器,用户可以轻松体验到开发的无穷乐趣。

正面与背面

_images/upload_9ca0f2e8545e2835e9b0a8b5ae0c1330.png

Web:Bit 外观长约 5 公分,宽约 5 公分,重量约 10 ~ 12 公克,带 25 颗 LED 灯为正面(图左侧),反之为是背面(图右侧)。

_images/upload_51dd835e8e65108c6f4edee97babc922.png

尺寸规格图

_images/upload_f43892b83561e0fbb5be54cd4b288b08.png

矩阵 LED 定义

Web:Bit 按照 5 * 5 排列方式焊接了 25 颗(编号 0 ~ 24 ) 1600 万色矩阵 LED (WS2812) ,所有的 LED 的控制仅使用一个引脚 (GPIO 4) 即可控制。

_images/upload_7fe376a15b4393441c58b84f052f8bb4.png

底部金手指定义

在 Web:Bit 的底部具有一排 25 Pin 的「金手指」接口,其定义如下。

注意:背面的金手指未连接硬件,所以无法使用

_images/upload_4545d093f0c3899da1495995597ec383.png

_images/upload_ca07897451dd2440025709b70978f2f4.png

内置传感器定义

Web:Bit 搭载了 25 颗矩阵 LED ,两个光敏传感器、两个按钮开关、一个热敏电阻、一个无源蜂鸣器和一个九轴传感器(分别为三轴加速度、三轴陀螺仪与三轴磁力计)对应引脚如下:

_images/table.png

驱动安装

为什么需要安装驱动,根据百度百科定义,驱动程序一般指的是设备驱动程序(Device Driver),是一种可以使计算机和设备通信的特殊程序。相当于硬件的接口,操作系统只有通过这个接口,才能控制硬件设备的工作。

因此,若是有需要专业开发硬件的用户,可以参考本文进行电脑驱动的安装,没有这种需要的话,可以跳过本文。

连接板子

板子采用 CH340 / CH341 串口驱动芯片,可以轻松的在 Windows 、 Linux 、macOS 等系统下自动安装驱动。

将板子通过 MicroUSB 线连接到你的电脑里,以下以 Windows 10 为例。

_images/connect.gif

查看驱动

进入 设备管理器 确认串口驱动(Serial)是否安装,进入方法如下。

  • (右键)此电脑 -> 属性 -> 设备管理器
  • 开始菜单 -> (输入)设备管理器
  • 控制面板 -> (搜索)设备管理器

_images/error.png

可以看到 设备显示 USB2.0-Serial ,说明未安装驱动,若此前已安装驱动,可以跳至步骤 5 。

安装驱动

点此获取 Serial CH341 驱动,并按如下说明操作安装驱动

打开下载的 CH341SER.ZIP 压缩包,进入 CH341SER 文件夹,打开 SETUP.EXE,即可看到如下图。

_images/install.png

点击 INSTALL (安装),等待片刻即可完成安装。

确认串口

核对板子是否连接成功

_images/success.png

可以看到原来的 USB2.0-Serial 消失了,取而代之的是 USB-SERIAL CH340(COM3),这意味着你已经成功安装驱动,并且得到板子串口名称为(COM3),你可以通过各种串口工具来查看串口名(COM3)的板子传出的信息。

其他系统

Linux 安装
  • 官方 linux Kernel2.6 以后默认自带,也可在此处下载

使用 Webduino 编程

通过 Web:Bit 专用积木编辑器,使用拖拽积木来轻松学习编程吧。

_images/editor.png

Web:Bit 教育版

Web:Bit 是 Webduino Bit 开发板的缩写,Web:Bit 教育版是由 Webduino 与台湾许多优秀的信息化教育的教师们,共同合作研发出的一款用于 STEAM 课堂的教学套件。

_images/editor1.png

下面介绍一下积木编辑器相关文档目录。

_images/menu.png

想知道更多?可以点击目录或底部 [ Next ] 按钮继续往下阅读。

编辑器介绍

Web:Bit 编辑器是 Webduino 的学习积木编程的软件,积木编程大幅简化了编写代码的步骤流程,并添加了虚拟仿真开发板小怪兽互动舞台外接拓展硬件等许多积木供你玩耍。不论是大朋友小朋友,都可以轻松的入门 Web:Bit 。

什么是积木编程?

对于第一次接触的人来说,可能不太清楚「积木编程」的由来,「积木」是翻译自「block」这个英文单词,其操作方式类似「组装积木」或「拼图」的概念,通过互相堆叠和搭配组合,就能判断不同的逻辑或依据指定的排列顺序,实现对应的程序动作。

_images/upload_307159386b586670a14bf1f5ec5fc23a.gif

编辑器类型

_images/upload_be9e4f1e27a719fed2161c1c19409f4e.png

编辑器分为 网页版安装版,功能与界面几乎完全相同,可以依据不同的教学场景需求采用不同的版本。

网页版

使用基于 Google Chrome 内核的浏览器即可体验积木编程,注意网页版暂不支持「USB 连接」开发板。

网页版链接:webbit.webduino.io
安装版
安装版下载:WebBitSetup_x.x.x.exe

安裝版目前只提供 Windows 7 以上的系统版本,界面与网页版保持一致,还能够更方便的初始化设置和使用「USB 连接」开发板。

操作界面说明

编辑器的操作界面分成下列几类区域:

  • 主功能菜单:包含文件的打开与保存、范例和教学、清空、更多功能和执行。
  • 积木/程序代码切换:将拼接好的积木转换为标准 Javascript 代码。
  • 积木列表:包含基本功能、小怪兽控制、开发板控制和物联网拓展...等积木。
  • 积木编辑区:进行积木的逻辑组合,产生各种不同的场景应用。
  • 开发板模拟器:包含一块虚拟的开发板,可以模拟开发板的实际状况和应用。
  • 小怪兽互动舞台:包含四种不同造型和颜色的小怪兽,可以通过积木设定相关动作和互动。
  • 缩放按钮:能够快速缩放画面积木或删除积木。
  • 画面折叠按钮:可以折叠开发板模拟器和小怪兽互动区,让积木编辑区域放大或缩小。

_images/upload_f63b41003e28555aeff8f6ee16471391.png

如何使用编辑器?

编辑器是基于 Google 所开发出的 Blockly 图形化编程工具,下面我们演示一下使用进行编程的效果。

_images/upload_33a9b73ee3cbdf221b611e0931b75774.gif

每块积木都有它对应的功能和用途,如果想了解该积木的使用方式,可以「使用鼠标在指定的积木上单击右键」,就能打开积木的功能列表,点击「教学」可以阅读该积木的教学文件,如果该积木有「小工具」,则可以点击小工具使用更多进阶功能。

_images/upload_c4c6cdc0de1c91c2558cffd94e90b0f3.png

积木使用小技巧
小技巧 1、多行与单行输入

如果积木程序太长,可以用鼠标在积木上点击右键,且该积木支持多行输入,可以选择「多行输入」将积木由单行变成多行,也更方便阅读和编辑。

_images/upload_8230ecfcdec22e4763e6c91d52a10fe5.gif

小技巧 2、整理积木

在使用积木编程的时候,往往会遇到积木四面八方散落在积木编辑区上的状况,这时可以在编辑区域上点击右键,选择「整理积木」将积木排列整齐。

_images/upload_0a5eafe50dec64e3e2d6fa239253f3cc.gif

网页版独有功能

右上方的主功能菜单,包含编辑器的主要功能,但「网页版」和「安装版」编辑器的菜单略有不同。

分享链接

在网页版可以使用「文件> 分享」,分享可以帮助我们保存积木分享给他人,它会产生一段「网址」,下次再开启这个网址就可以载入分享的积木,但是安装版无法使用该功能。

_images/upload_d3033bfde0425d6e16c1858a89b2ae85.png

在网页版主菜单的「更多」里面,包含「下载安装」的选项,点击后会下载安装版的压缩文件,解压缩安装就可以使用安装版。 ( 目前安装版编辑器仅支持 Windows )

_images/upload_90807bd259b8c6159aad92f7686fd0ee.png

安装版菜单说明

打开安装版之后工具列里分别有「系统」、「工具」和「信息」三个主要功能列表,如果你没有出现下图的工具列,可以按下电脑键盘的 Ctrl + W 打开工具列,。

_images/toolbar-01.gif

系统 > 通过浏览器打开

点选「通过浏览器打开」,会自动打开电脑的 Chrome 浏览器并连接至编辑器(网页版),如果没有该选项,请下载安装 Chrome 浏览器 到系统里。

工具 > 关闭 USB 连接

如果开发板使用 USB 线 连接到电脑,安装版可以在没有 Wi-Fi 的状态下控制开发板,但此时开发板也将「关闭 Wi-Fi 连接功能」,如果要开启开发板的 Wi-Fi 连接功能,则需关闭安装版程序,或是点击「关闭 USB 连接」功能。

如果关闭 USB 连接,开发板就会采用 Wi-Fi 连接模式,反之开启 USB 连接就会关闭 Wi-Fi 连接功能。 详细操作方式会在「开发板功能」 介绍使用方法。

_images/upload_8d9b6d8facf9d70b7d06e22b1aa48757.png

工具 > 恢复出厂固件

可以解决开发板大部分疑难杂症,并回到初始状态。

_images/20190801094352.png

工具 > 设置 Web:Bit WiFi

该功能帮助开发板连接网络,如果没有 Wi-Fi 控制开发板的需求,可以不需要使用该功能,点击该选项之后,会要求我们输入 Wi-Fi 的 SSID 和 密码,这功能可以帮助我们将「WIFI 路由器」的 Wi-Fi 名称(SSID) 和 密码 设置到开发板中。

特别提醒!如果无法使用该功能需要恢复出厂固件。 详细设定步骤可以参考 「开发板设置」 恢复出厂固件可以参考 更新固件方法 1:使用安装版进行更新 > 恢复出厂固件

_images/upload_5adc4e1cd8a9aad3325832e39268ddc2.png

_images/upload_6606fc470897e6ba6c2a2d06470c96ac.png

工具 > 设置 Web:bit MQTT 服务器

在这之前请先配置开发板的 WIFI 连接到路由器,这将为开发板配置 Web:bit 无线控制的外网服务器,外网就是指互联网(广域网)。

如果想要在外网的环境(如咖啡厅的 WIFI 网络)下 控制 连接到家里 WIFI 的开发板(家里的 WIFI 必须能够上网浏览网页)。

这就需要设置 MQTT 服务器的地区,如中国或全球(不同地区的服务器不能互联),此时使用开发板 WIFI 连接即可在外网控制。

工具 > 更新固件

如果软件提示开发板有新版本的固件,可以点击该选项进行固件更新。

特别提醒!如果无法使用该功能需要恢复出厂固件,可以参考 更新固件方法 1:使用安装版进行更新 > 恢复出厂固件

_images/upload_2eb67fe4b80aa5bed56f592eddc5fb2c.png

信息 > 版本、复制设备 ID、帮助

版本功能会显示目前的固件版本,复制设备 ID 可以将开发板的 Device ID 复制出来,而帮助会显示安装版支持的各种快捷键。

_images/upload_0cf91b296511f8a9f78812a9d5abed9f.png

更新开发板固件

想要使用编辑器软件控制 Web:bit 开发板,需要为开发板 安装 或 更新 固件,可以选择下述多种方法给 开发板更新固件 或 恢复出厂设置 。

什么是编辑器?点此查看 Web:bit 教育版 > 编辑器介绍
更新固件方法 1:使用 安装版 进行更新
什么是安装版?点此查看 Web:bit 教育版 > 编辑器介绍 > 安装版

将开发板通过 Micro USB 线连接电脑,最上方会出现安装版的「版本号」(如:V1.2.4)以及「扫描 USB 设备」的提示,此时可以将开发板通过 USB 线连接电脑,让软件进行自动扫描并连接。

_images/upload_3f793de122644f3c4fb1f17de0bcc6341.png

连接到开发板后,安装版上方会出现开发板的 Device ID 以及固件版本号,接着开启菜单栏(没有可以按下键盘的 Ctrl + W 出现),用鼠标选择「工具> 设置 Web:bit WiFi」,开始进行初始化设置。

_images/upload_832cf2a13eb24e1c994fac3ea4d81373.png

在电脑中打开 安装版 软件,将开发板通过 Micro USB 线连接电脑,确认安装版已经正确连接到开发板之后( 上方会出现开发板的 Device ID 以及版本号码),按下Ctrl + W 打开工具栏,鼠标选择「工具> 更新固件」,就可以开始更新固件。

_images/upload_bbb1222a27c9694ab3b8a1a71515c837.png

如果检测到有新版本固件可供更新,也会在开发板连接电脑后弹出对话框提示。

_images/upload_46c7a296ad1a32710e18c8dfb11a2ceb.png

如果没有弹出对话框提示,也会在上方的信息文字里,出现提示更新的消息。

_images/upload_986d0f00a17dbae92eff4feb19c21ab2.png

点选更新后,会再度提示请勿关闭程序或移除 USB 线,按下确认后就开始更新。

_images/upload_ffc83447d7c649a0c51d19fe6b930632.png

更新时最上方的信息文字,会同步显示更新的进度。

_images/upload_d83789034c2b05d079e1d6a6b03477f1.png

更新直到 100% 之后会显示目前的版本号码,表示 开发板固件已经更新完成,如果没有反应请检查线材。

_images/upload_e994b6436ddb867b584438e86d7b29b4.png

恢复出厂固件

如果一直是「扫描 USB 设备」(长达三分钟),没有出现连接成功的消息,则表示 Web:Bit 开发板的固件可能有问题,此时可以用鼠标选择「工具 > 恢复出厂固件」进行固件修复。

_images/upload_c50c3839f4d1fe1f8e60694b1c2813fb.png

连接成功的可忽略此步骤,恢复出厂固件可能会让 Device ID 不同,请特别注意!

_images/upload_c2ec7e8b5a7f87de903f5edf882fe41d.png

更新固件方法 2:通过 Wi-Fi 远程更新
开发板联网需要先进行初始化,请查阅 Web:bit 教育版 > 开发板设置

远程更新 ( OTA ) 可以在开发板连上网络后,连接远程服务器更新获取最新版本固件,更新步骤如下:

  • 步骤 1、确认开发板已经可以正常连上 WiFi,若不行,请检查 WiFi 连接或重新进行初始化设定。
  • 步骤 2、断开开发板电源。
  • 步骤 3、连接开发板电源,**在显示白色跑马灯文字的时候,开始持续按住按钮A,直到开发板闪完红灯后没有亮绿灯表示失败,回到步骤 2 、直到出现绿灯熄灭后,此时会再听到蜂鸣器发出轻微的一个声响,此时放开按钮 A **。

_images/ota-06.gif

  • 步骤 4、完成后会看到开发板的LED面板,由第一颗灯开始亮蓝灯,表示开始进行更新,当蓝灯全部亮起接着熄灭后,表示更新完成

_images/ota-07.gif

  • 步骤5、更新完成后开发板会闪红灯自动进行连接,连接成功会亮绿灯,接着绿灯熄灭,表示 OTA 更新固件完成。
恢复出厂设置

遇到奇怪的问题的时候无法解决,不妨试试还原硬件出厂时的设置,步骤如下:

  • 步骤 1、断开开发板电源。
  • 步骤 2、同时按住按钮 A 和 B
  • 步骤 3、连接开发板电源,听到蜂鸣器发出声响后放开按钮 A 与 B,此时开发板已经恢复出厂设置。 ( 恢复设定值会将自定义 XXX 的 Wi-Fi 帐号、密码、自定义的 Device SSID 和密码清除,这个步骤会造成开发板无法连接所在场所的 Wi-Fi )
  • 步骤 4、重新进行初始化设定,请参考:Web:bit 教育版 > 开发板设置

开发板设置

在往下使用开发板的 WIFI 联网功能之前,需要先进行初始化设置,通过本节的初始化设置可以让开发板可以连上网络(Internet),还可以够自定义开发板的 WIFI 显示名称和密码,更是可以通过网络进行远程更新(OTA)。

初始化后可以通过「Wi-Fi」控制开发板,如果只是使用「USB 控制」开发板,则可以跳过初始化设置。
初始化方法 1:使用安装版进行初始化
什么是安装版?点此查看 Web:bit 教育版 > 编辑器介绍 > 安装版

使用安装版按照下列步骤进行初始化设置。

步骤 1、进入菜单 > 工具 > 设置 Web:bit WIFI

将开发板通过 Micro USB 线连接电脑,打开安装版后,软件顶栏会出现安装版的「版本号(如:V1.2.4)」以及「扫描 USB 设备」的提示(如下图),此时可以将开发板通过 USB 线连接电脑,让软件进行自动扫描并连接开发板。

_images/upload_3f793de122644f3c4fb1f17de0bcc634.png

连接到开发板后,软件顶栏会出现开发板的 Device ID 以及固件版本号(如下图),接着查看菜单栏(没有看到需要按下键盘的*Ctrl + W* 开启),用鼠标选择「工具> 设置 Web:bit WiFi」,开始进行初始化设置。

_images/upload_c792e42e263f5a843da6255867d1a77f.png

*注意!没有出现如图连接情况,请使用 Web:bit 教育版 > 更新开发板固件 > 恢复出厂固件
步骤 2、设置 Web:bit Wi-Fi 的名称(SSID)与密码

点击设置 WiFi 后,会弹出一个对话窗,此时要填入想要连接的 WiFi 的名称和密码。 ( 这里就填入自己所在场所(例如:公司、学校或家里)的 Wi-Fi 帐号和密码 )

设置 WIFI 连接的名称(SSID),存在配置则会读回,默认值是 webduino.io

_images/upload_621ed89a98ab4e189626b6f46381ddd5.png

设置 WIFI 连接的 密码 ,存在配置则会读回,默认值是 webduino

_images/upload_3e99dc9aeb3caa3e2793b1528718f1e0.png

设置完成后,会弹出一个对话窗口,询问是否关闭 USB 连接,如果选择「确定」,开发板就会通过先前的 Wi-Fi 的帐号与密码,连接到指定的 Wi-Fi ,如果选择「取消」,就会关闭 Wi-Fi 连接功能,此时只能使用 USB 连接操作。

_images/upload_4b45f7eb17a57e6a31f1d483db93047e.png

若选择关闭 USB 连接功能,开发板会进入 WIFI 连接模式。

此时开发板会重启并闪烁红灯,当 红灯熄灭绿灯亮起 之后,表示 Web:Bit 开发板已经成功连接上 WiFi 。

_images/upload_9fc275139e019a3ba9f86d0fd133c762.gif

  • 若红灯持续闪烁或恒亮,请拔掉电源,重新操作步骤 1 与步骤 2 。
  • 若红灯闪完后亮起「蓝灯」而不是绿灯,表示已有新版本可以进行下载更新,请参考Web:bit 教育版 > 更新开发板固件

_images/upload_184a8ab60565dbd34c2e4cac4a0a530b.gif

初始化方法 2:WIFI 连接到开发板进行初始化

如果想通过无线控制开发板,可以通过有 Wi-Fi 连接功能的笔记本电脑或移动设备(手机),连接到开发板的 WIFI 热点进行初始化设置,相关步骤如下所示:

步骤 1、接上电源,输入 WiFi 帐号和密码进行连接

使用 USB 线为开发板接上电源,此时开发板正面的 矩阵 LED 会滚动显示一串文字( 默认是 bit 三个英文 + 四个数字 ),如下图的滚动显示的 bit1234 。

_images/setup-05.gif

这串文字会出现在其他可以连接 WIFI 的设备的 WiFi 名称列表中,例如下图显示的 bit1234 ,在 WiFi 搜索界面中就会看到 bit1234 的 WIFI 名称。

_images/setup-06.jpg

滚动结束后,第一次使用开发板未进行初始化设置,就无法连上外网(Internet)服务器,所以 会闪红灯,或者红灯恒亮 。这时请准备一台具有 WiFi 功能的电脑、手提或移动设备(手机),使用这台设备进行 Wi-Fi 搜索,连接刚刚看到为「bitXXXX」的装置( 以上述的例子就是 bit1234 ),找到该设备后,输入默认密码 12345678 ,进行连接即可。

步骤 2、设置 WiFi 帐号密码与显示名称

确认连接成功后,打开浏览器 ( 建议使用 Chrome ),地址栏输入 192.168.4.1 会进入到 Web:Bit 开发板的设置画面,画面中包含以下几种设置:

_images/upload_6e1c12f5120345e4e97d8d05d9251791.png

可在下图表格中找到对应设置项详细解释。

_images/settings.png

设置完成后按下 SUBMIT 保存,出现 SAVE OK 的字样表示设置成功。

_images/upload_3ec8cc6a377c2a2cd987be93d391da60.png

此时开发板会重启并闪烁红灯,当 红灯熄灭绿灯亮起 之后,表示 Web:Bit 开发板已经成功连接上 WiFi 。

_images/upload_9fc275139e019a3ba9f86d0fd133c762.gif

  • 若红灯持续闪烁或恒亮,请拔掉电源,重新操作步骤 1 与步骤 2 。
  • 若红灯闪完后亮起「蓝灯」而不是绿灯,表示已有新版本可以进行下载更新,请参考Web:bit 教育版 > 更新开发板固件

_images/upload_184a8ab60565dbd34c2e4cac4a0a530b.gif

积木编程基础

变量

变量,是所有程序都会用到的基本元素,使用前会赋予变量一个名称,接着就可以用这个变量来表示文字、数字、数组、颜色或逻辑。

新增变量

使用变量的第一步,就是「新增一个变量」,打开编辑器,将「设定变量为」的积木拖拉到积木编辑区中,下拉选单选择「新变量」,点选后弹出对话视窗,输入新变量的名称即可新增一个变量。如下图 ( 建议变量的命名尽可能以「英文 + 数字」为主 )

_images/upload_692cb4676e22fabba168b81fd4fc8942.png

在新增的变量后方加上对应的值 ( 值可以是文字、数字、数组、颜色或逻辑 ),这个变量就等同于这个值,如果没有赋予值,这个变量就是空变量。

_images/upload_91de3aa8dd28541f92a746d5d80dc9b2.png

新增变量后,在左侧积木清单的变量目录下,也会看到新增的变量积木。

注意,如果在编辑画面里完全没有「设定变量为 XXX」的积木,积木清单里就不会看见 XXX 的变量积木。

_images/upload_0247f43ea7b357bccf0312d532cec450.png

设定变量

设定变量表示赋予变量一个值,使用方式和新增变量完全相同,由于程序语言有「后面覆盖前面」的特性,所以如果变量名称相同,后面设定的值会覆盖掉前面设定的值 ,以下图的例子而言,变量apple 最后的值为456。

_images/upload_4252b4401f914b7e136be1e5d5eb65fc.png

重新命名变量

区别于「新增变量」,重新命名变量可以将画面中所有相同的变量统一改名,例如画面里出现了四次 apple 的变量,通过重新命名,可以将四个 apple 变量名称全部换成 ball。

_images/upload_0a808a5d0cba23367ada8f2e0ca1045a.gif

变量增加

变量增加表示「让变量的值增加多少」,假设原本变量的值为 1 ,使用变量增加 1 之后,这个变量就会加 1 变成 2 ,同理,如果使用变量增加 -1 ,那么这个变量就会加(-1)变成 0 。

_images/upload_974c14c2cab0fa43e48c69fa8f230a60.png

注意,如果是不同类型的改变,例如原本的变量是文字「苹果」,却增加 数字「1」,最后得到的结果是「苹果1」三个字,同理如果变量是数字「1」,而增加文字「苹果」,得到的结果是「1苹果」。

_images/upload_4e99e403bd636d4708affc09d34547a2.png

使用变量

新增变量或设定变量完成后,就可以在积木编辑区中使用变量,以下图为例,先设定a 变量为1,b 变量为2,接着就能计算a + b 或a ÷ b 之类的数学运算,或进行判断a 和b 哪个值比较大的逻辑判断。当程序逻辑越来越复杂,就得通过变量来操作。

_images/upload_af5c87709a5df7b84a596578ebf61373.png

逻辑

逻辑是很多的条件和判断,当满足了某些条件就会执行某件事,例如听见闹钟响就该起床、看到绿灯才可以通过...等情况,就是一些简单的逻辑判断。在日常生活里,无论是写程序、数学计算,还是法庭辩论,甚至是路上交通、买卖东西或要不要起床,都包含许多「逻辑」的成分,

逻辑积木清单

逻辑的积木由一个主要的积木「如果...执行...」( 前方有蓝色小齿轮的积木),分别搭配九种逻辑判断的积木( 判断、逻辑运算、数字型态、空值、包含值、真假值...等)组成。

_images/upload_d74453b817d8cbc8f67420a7333056cb.png

逻辑判断

「逻辑判断」积木预设有两种型态的组装「缺口」,在上方比较小的是「条件判断」 如果,下方比较大的是「执行内容」 执行,代表着如果情况满足上方的条件判断( 判断返回值为「真」或「ture」 ),就会执行对应的内容

_images/upload_16cadd8a887cd7d7c8571d29cb6dc5be.png

点选左上方的蓝色小齿轮,可以新增逻辑判断的条件,点一下可以打开,再点一下关闭。

_images/upload_c1d95e67bf824e8681c654f61745add0.gif

逻辑条件判断有三种:「如果」一定是在第一层,「否则如果」在中间,「否则」一定在最后,「否则」的条件判断表示当「如果」和「否则如果」的条件都没有满足,就会执行「否则」的内容。如下图

_images/upload_5945cdf322fcb3bf5cabddaec5e06cc4.png

如果只有两个条件,例如非 A 即 B,只需使用「如果」和「否则」就可以。

_images/upload_fbf73927c61a23deda1b01145a3de5a1.png

条件判断式

条件判断式主要会放在逻辑的「条件判断」缺口内,提供不同情境的逻辑判断,判断的条件主要分为:等于(=)、不等于(≠)、小于(<)、小于等于(≦ )、大于(>)、大于等于(≧)。

_images/upload_cb9448f68887c711b063359ef36932b8.png

用法:只要把条件判断式的积木,放到判断条件的缺口内即可。如下图

_images/upload_186028a15795813539076734ad9ff8f0.png

举例来说,可以先新增一个变量a 为0 到100 之间的随机整数,并让绿色小怪兽讲出数字,接着用逻辑判断,如果变量a 小于60 ( 返回判断为「真」(true) ),就让红色怪兽讲「不及格」,否则就讲「及格」,执行程序后就能看到对应的结果。

_images/upload_eeaa27d92157eade277a5dcf36857317.png

逻辑运算符

「逻辑运算符」积木为逻辑判断提供了更弹性的条件判断,当中包含了「」与「」,如果使用「且」,在两端判断的条件必须都满足时,才会执行动作,如果使用「或」,只要满足其中一个条件就会执行动作。

_images/upload_8f782a8a26b0d48c224cea14db2e418c.png

通常当逻辑判断里出现「如果.否则」的时候,就会用到逻辑运算符,而逻辑运算符常常和条件判断的积木搭配使用。 ( 有时也会遇到只有「否则如果」搭配逻辑运算符的情况 )

_images/upload_42f9c58678c6331a73c6000333291869.png

以刚刚的例子来说,可以增加到四个条件判断,分别是 0、1~59、60~99 和 100,当条件判断成立时,就会让小怪兽说出数字以及对应的文字。

_images/upload_e11ae559f854d5034ee6a9400629a365.png

判断数字型态

「判断数字型态」积木可以帮助我们快速判断奇数、偶数、整数、数字有小数点、文字和数组

_images/upload_d6587c54a4a8a374d8c3526cce3d3080.png

用法:只需直接放入条件判断的缺口内即可。如下图

_images/upload_b154c49ccea77e77c9a8018d8a4e6c3c.png

例如我们可以设定变量 a 为两个随机数相除,再通过小怪兽讲出整数或小数。 ( 除法的积木使用了「多行输入」,可以在积木上按右键选择多行输入,教学参考:程序积木小技巧

_images/upload_32bdf404013aa3ff57dbfd13ec0cba63.jpg

判断空值

「判断空值」积木主要是和「数组」积木搭配,如果是空值返回「真」(true),否则返回「假」(false)

_images/upload_940a527a986f027d4312a3e3f9f908e6.png

会产生空值有几种情况:「无文字、数字0、空数组、空值、「假」(false)、没有值的变量」,如果满足这几种情况,就会返回「真」(true) 。

_images/upload_d3859a77c9c8d2f118e63f93daad933b.png

判断是否包含文字

「判断是否包含文字」积木可以检查某段文字内,是否包含了指定的文字或文字段落。

_images/upload_e19fc6c7bb1646e1c55ae7742d71f5ea.png

举例来说,如果检查「你是我的小呀小苹果」里面有包含「小苹果」,绿色怪兽就会说「找到小苹果了」,反之如果是「小柠檬」,红色怪兽就会说「没有小柠檬」。

_images/upload_db8ca02956d5db204ba27bc507384141.jpg

「非」积木就如字面一样,表示「否」,通常会和「真/假」或「空值」的积木搭配使用。

_images/upload_8e537cdd9a0fbe90e1305185cedc64c5.png

如果把积木接在「非」的积木后面,状态就会反过来,例如空就会变成非空(不是空的)、真就会变假,假就会变真,以此类推。

_images/upload_4594830254e82507a032e5679cac1ddc.jpg

真/假

「真/假」积木主要表示「真」(true) 与「假」(false) 两个值,目的在判断的时候,在数字、文字之外,多一些判断的条件。

_images/upload_48176ba391825c26aaef72b3595b60be.png

在写程序的时候,有时候会遇到某个变量或是某个数值变成空值 ( null ),这时就可以使用空值的积木判断,用法和「真/假」的用法类似。

_images/upload_810b05b8276ef7170332561e0d1e94b8.png

三元逻辑运算符

「三元逻辑运算符」积木是针对只有「两种条件」的问题,并针对根据条件传回「两个运算式」的其中一个。

_images/upload_f62416838b47bcaf4ef9a3085dad9247.png

比如上面提到的及格与不及格的例子,因为只有两种条件,就可以通过三元逻辑运算符来轻松实现,且还可以使用比较少的积木来完成同样的结果。

_images/upload_e71e8699fedf0988d8a4d0b7a122f5d1.jpg

循环

在程序领域里,循环 是常常使用的基本功能,循环就是循环执行程序,将需要循环执行的积木放在循环积木内,就能循环指定次数、延迟循环时间,或是执行无限次循环积木。

循环积木清单

循环的积木分别有一个「等待」的积木,五个不同循环模式的积木和一个「停止循环」的积木。

_images/upload_ca6884696c2d35d55891c84efe72d3e3.png

等待

「等待」积木可以让程序暂停一段指定的时间,当程序积木里遇到「等待」积木,就会等待指定的时间之后才会进行后面的动作。

_images/loop-23.jpg

以下方的例子来说,如果不加上「等待」,四只小怪兽会同时说出 hello,如果加上等待 1 秒,四只小怪兽就会以每隔一秒时间,依序说出 hello。

  • 没有加上「等待」积木

_images/upload_a56e532f444f10f1b63e0a204061e30b.png

注意,上述所谓的「同时」,是针对人类肉眼来说的意思,对于程序而言仍然是按照顺序进行,只是间隔时间非常短,短到人类的肉眼分辨不出来
  • 加上「等待」积木

_images/upload_293de1e01c5e037871f6163c6558dc73.gif

循环执行几次

「循环执行几次」积木,可以指定循环内的积木所循环的次数,积木预设次数为 10 次。

_images/upload_f79542ae68a6272f380d047e89a50d73.png

通过循环10次,可以让小怪兽旋转 100 度。

_images/upload_d127a673a65ffa14a8d0bc1850e227d8.png

延续前面介绍过的「等待」,如果在循环里头不加入「等待」,就会看见怪兽瞬间旋转了100 度,如果我们再加上等待0.5 秒的积木,就会看到怪兽每隔0.5 秒旋转10 度,旋转十次。

_images/upload_6581350ae4072c6853deb40ba6c1b8715.gif

计数循环

「计数循环」积木有点类似「循环执行几次」积木的进阶版,差别在于计数积木使用了一个变量,通过改变这个变量的数值,来决定循环几次、如何循环以及循环的间隔。

如下图,因为内含一个变量,所以当编辑画面里有计数的积木,在变量的目录下也会出现一个对应的变量i。

_images/upload_931c65737aff90e055172a2bc1b0046f.png

使用「计数循环积木搭配等待」,可以让绿色小怪兽每隔0.5 秒讲出变量i 的数值,这个变量i 会根据我们指定的起始数值、最终数值和间隔作数值进行递增或递减,以下图的例子而言,变量i 会每隔0.5s 进行加1,直到变成10 为止( 也就会依序念出1234...10 )。

注意,如果要「依序」念出数字,一定要加上「等待」的积木,不然就会呈现最后的数字。

_images/upload_908d5656340dfec2d3493cb91b4bb0fc.gif

循环无限次

「循环无限次」积木会无止尽的一直执行循环积木内容,除非使用「停止循环」积木,循环的事件才会停止。

_images/upload_e31a0f641fd9e1812671054b40556bf5.png

延续前面介绍过的等待,在「循环无限次」的积木内加入「等待」,搭配小怪兽的旋转,就可以让小怪兽不断地旋转。

_images/upload_d170f481f8ae8aacb7857631becdff80.gif

判断为真,就循环无限次

「判断为真,就循环无限次」积木等同于「循环无限次」积木加上「逻辑」判断,只要 如果 后面缺口的逻辑判断为「真」( true ),就会开始进行无限循环

_images/upload_4d24b8aba98c0f9b641ca205da27a3c5.png

举例来说,我们可以先设定一个变量 a 为 2 到 9 之间的数字,透过判断如果 a 是偶数,就让小怪兽开始旋转,否则就不旋转。

_images/upload_382e2b22cb51186e60dad591d1381be4.gif

上面的例子也可以使用「逻辑」搭配「循环无限次」来实现同样的效果。

_images/upload_a2efd4f119a98ec24fe026edc06ac3a1.png

取数组元素并执行

有别于上述的循环方式,「取出数组元素并执行」积木是以数组长度作为循环次数的依据,因此数组后面缺口内必须放入数组积木,执行后就会依序取出数组内容并执行对应动作。

_images/upload_5ce25b86a4d39f1a5a9eb37ce0e55b86.png

如下图,我们可以设定变量 a 为一个数组,里头放入五种水果名称,接着设定一个变量 i,依序让变量 i 等于水果名称,再让小怪兽讲出水果名称并进行旋转的动作。

_images/upload_8578fd8cf709d07c7f0ce194d2675365.gif

后台执行

「后台执行」是所有循环积木里头的功能选项,由于程序码的执行顺序缘故,「前一段程序尚未完成前,无法执行下一段程序」,也因此大多数的情况在画面上只能执行一个循环,然而后台执行可以同时使用多个循环

_images/upload_89cb190849c5f3c10505ab4408333d8b.png

举例来说,如果我们使用两个「循环十次」的积木,都不勾选后台执行,第一个放入小怪兽旋转,第二个放入小怪兽移动,网页执行后,就会看到小怪兽先旋转再移动

_images/upload_2e869e3909426065dbe1f26797fed529.gif

如果我们把上面例子中的循环积木,都勾选后台执行,网页执行后就会发现小怪兽一边移动一边旋转

_images/upload_fca308cfb10229cf2cb36d2604d51c3e.gif

是否有后台执行,在「循环无限次」的情况下会更容易发现差异,如果画面中有两个无限次的循环,如果没有勾选后台执行,因为行为还停留在前一个无限次循环,在后面的循环就不会执行

_images/upload_7379ccd91a2ab2e57d15a51dbcef0c62.gif

停止循环

上述所有的循环行为,都可以通过「停止循环」积木来停止,停止循环又分成「停止画面上所有循环」,或「放在循环内,停止所在位置的循环」。

_images/upload_b1817a24a19b730c925b2f0c4af96e26.png

例如在「循环无限次」积木里加入「小怪兽旋转角度大于 90 度就停止这个循环」的判断,就会在小怪兽角度大于 90 度时停止循环,继续执行下方的讲话程序。

_images/upload_7ce353ec6f92ec9ac4b9cc2bae786417.gif

如果有多个循环,也可以使用「停止所有循环」来停止,例如下方的程序,当小怪兽旋转角度大于 90 度,就会停止所有循环。 ( 此处勾选了后台执行,请参阅「后台执行」章节 )

_images/upload_55f343e086261afb02b6988c542ea8f3.gif

文字

文字积木除了可以显示有意义的词汇,也可以通过相加的方式把文字组合成文本(文本是由文字组成的),或是在一段词汇文本中寻找对应的字词或字母。

在编程的领域中,文字即字符,字符是指计算机中使用的字母、数字、字和符号,文本即字符串,字符串是由一串字符组成。

文字积木清单

文字积木分别有指定文字、换行、转换大小写、建立字串、文字工具、文字查找、文字取代、文字转换...等常用的文字功能。

_images/upload_5c03f0c1fd1c247a8c76419994cbbe5b.png

指定文字

「指定文字」积木可以输入指定的文字,以便其他积木使用。

_images/text-02.jpg

例如在小怪兽讲话积木后方接上指定文字,输入 hello,执行后小怪兽就会说出 hello。

_images/text-03.jpg

换行

「换行」积木可以将一段文字从指定的位置换行。

_images/upload_d6a8bd61e12e54c7f3c5e3ad7a01a5da.png

建立文本

「建立文本」积木可以把不同的文字积木组合成一段文本。

_images/upload_4d6f5e42864bb06f88ca28ebadf3a48e.png

点击蓝色小齿轮,通过拖拉组合可以增加文字缺口。

_images/upload_78bed0534676a80a7423dd603b2e4581.gif

在文字缺口内放入指定的文字积木或是换行积木,就可以让文字组合出想要显示的文本。

_images/upload_d9ed1672b318256d9807c626ff9693ac.png

建立文本也可以用来组合两个变量,例如变量 a 为 hello,变量 b 为 world,通过建立文本就能将两个变量组合为中间换行的 hello world。

_images/upload_362a69d6462aeb94b797a5625fd46b44.png

在变量后方加入文字

「在变量后加入文字」积木能够改变原本变量的内容,使原本变量的内容后方额外增加文字。

_images/upload_4c010ea08114476a13aa29499d3c1c10.png

因为是以「变量」为主,所以如果要让小怪兽讲话,就变成是使用变量的方式呈现。

_images/upload_021201b6ae68c449d8395d9703d1e792.png

取代文字

「取代文字」积木可以快速将一段文字里的某些字,替换为其他的文字,下拉选单可以选择更换第一个指定的文字,或所有指定的文字。 (取代文字不会对变量进行变更,而是产生一段全新的文本)

_images/upload_49a7f9cff19c7af7d963baa44dbad6bb.png

下图的例子可以只更换第一个「苹果」为「杨桃」,或是更换所有的「苹果」为「杨桃」。

_images/upload_3f8739691e3973af97e356cf0e6de17b.png

寻找文本出现位置

「寻找文本出现位置」积木可以在一段文本中找出指定文本出现的位置,可以选择第一个出现的位置或最后一个出现的位置。

_images/upload_eebbd7dbcc332717aa401fc567f8619c.png

文字出现的位置是以「字数」来判断,以下图的例子,橘子的「橘」位于整段文字的第4 个位置,所以出现的数字为4,苹果的苹出现在第10 个位置,如果换成英文,orange 的o 位于第8 个位置,banana 的b 位于第16 个位置(逗号后面还有一个空格,空格算一个字符)。

_images/upload_7b239d9fbc07c0bc8d35fa6bd420e84d.png

取得指定位置的文字

「取得指定位置的文字」积木会取出文本中指定位置的文字,下拉选单共有五种指定位置,分别是第几个、倒数第几个、第一个、最后一个和随机位置。

_images/upload_8556548d2e5e09c38e467238b62caa61.png

以下图的例子,第 4 个字是橘,第 11 个字是果。

_images/upload_d23a1f6a85a95b0b688d13584547be27.png

取得指定区间的文本

「取得指定区间的文本」积木会取出一段指定区间内的文本,需注意的是第一个空格的数字要比第二个空格内的数字小

_images/upload_459d558b111042bf3394fe484aeb4e57.jpg

以下图的例子,第 3~8 的文字为「、橘子、西瓜」,而第 8 到最后的文字为「瓜、苹果、香蕉、西瓜」。

_images/upload_acc74ac1a1f548668e24207009839685.jpg

转换大小写

「转换大小写」积木可以针对「英文字母」进行大小写转换,包含全部转大写、全部转小写或是首字母大写。

_images/upload_30fe4ab135b86e23fc3541e801f35667.png

以下图的例子,可以全部转换为大写,或是只有第一个 A 是大写。

_images/upload_9c985f296dbec4db22f7591469fc5777.png

消除空格

「消除空格」积木可以消除一段文字中左边、右边或左右两边的空格。

_images/upload_609a2bc25a8e60cbac6ad06a5b405702.png

进制转换

「进制转换」积木能把数字转换为二进制、八进制、十进制或十六进制的数字。

_images/upload_344dcf0486805fe6ab79aedc03abbd81.png

例如数字 200 转换为二进制就是 11001000,转换为八进制就是 310,转换为十六进制就是 c8。

_images/upload_b0abca256a8565665b466e2068206fa5.png

文字长度

「文字长度」积木可以取得一段文本的总字数,需要注意的是英文字以「字母」为单位,且空格也算是一个文字。

_images/upload_84526e5790769135da11f6be58cec8a2.png

以下图为例,「一个苹果」的文字长度为 4,「An apple」因为包含空格,所以文字长度为 8。

_images/upload_1102ffa30013f5ca07d469657df9fec0.png

数组

数组可以将数字、文字、列表或变量,按照顺序组合起来,这些按序排列的集合就称作数组,一个数组可以再细分为多个元素,或是一个数组内还包含其他数组,在进行比较复杂的运算时,也会通过数组的一些操作来实现。

数组积木清单

_images/01.png

空数组

「空数组」积木会建立一个数组容器,也就是里面没有包含任何元素的数组。

_images/02.png

如果要用变量进行数组的操作,首先必须把这个变量定义为数组或空数组,才能针对这个变量进行数组数值的添加、删除、编辑...等动作。

_images/03.png

建立数组

「建立数组」积木可以在指定位置放入许多对应的内容,建立一个可以链接各类内容的数组。

_images/04.png

点击蓝色小齿轮 ⚙ ,可以增加更多可放入内容的缺口。

_images/05.gif

这个数组建立完成后,可以试着让小怪兽讲出这个数组(数组的内容会用逗号分隔)。

_images/06.png

或是可以使用下述积木,从数组中取出每个内容,并依序讲出数组内容。

_images/07.gif

建立重复内容的数组

「建立重复内容数组」积木可以建立具有重复内容的列表,内容可以是变量、文字、数字或数组,将其放入缺口内,就会根据设定的内容建立数组。

_images/08.png

效果就是让「芭乐」文本词汇重复建立五次并添加到数组中,这时候绿色小怪兽就会念出五次「芭乐」。

_images/09.png

设定数组内容

「设定数组内容」积木可以针对数组的内容 ( 第几个、倒数第几个、第一个、最后一个和随机 ) 进行三种编辑行为 (也就是设定、插入或移除 )。

_images/10.png

举例来说,假设一个数组有四种水果苹果、柳丁、香蕉和芭乐,通过「设定数组内容」积木将数组中第一个水果元素换成莲雾,这时候 绿色小怪兽 讲出数组的第一个水果就变成了莲雾,然后试试移除数组的第二个内容,此时红色小怪兽讲出的数组就会变成只有三种水果(莲雾、香蕉和芭乐)。

_images/11.png

接着使用「插入」文本桃子在「最后一个」,就可以看到数组又变成四种水果,最后一种是桃子。

_images/12.png

取得数组内容

「取得数组内容」积木可以取得一个数组中某个元素的值( 第几个、倒数第几个、第一个、最后一个和随机),或是取得某个元素的值之后,同时移除该元素。

_images/13.png

如果单纯取得某个元素的值,并不会影响原本数组的内容和长度,但如果是「取得并移除」,这个数组就不再包含这个元素,例如一开始有四种水果,如果只是取得内容,取得内容后的数组依然是四种水果,不过如果取得后移除内容,取得内容之后数组就变成了只有三种水果。

_images/14.png

寻找数组内容

「取得数组内容」积木能从一个数组中,找到特定元素所在的位置,并回传该位置的编号。

_images/15.png

通过取得数组积木来取得水果数组,就能知道苹果位在第一个位置、柳丁位在第二个位置、香蕉位在第三个位置、芭乐位在第四个位置。

务必注意,如果是「代码」而非使用「积木」,第一个位置通常都是 0 ,第二个位置是 1 ,但是为了和生活习惯保持一致,在积木中的第一个位置的显示为 1 ,第二个位置为 2 ,以此类推。

_images/16.png

数组排序

「数组排序」积木会将指定的数组内容按字母、数字的规则进行排序,排序后会得到一个新的数组,不会影响原本数组的内容

_images/17.png

从下图的例子可以看出,绿色小怪兽会讲出按照字母排序过后的水果数组( a, b, c, .... ),而红色小怪兽讲出原本的水果数组并没有受到数组排序积木的影响。

_images/18.png

如果选择字母排序,就会「先按照字母大小写排序,大写在前,小写在后,排序后再按照第二个字母排序」,如果选择不区分大小写,就会直接进行排序,「 如果第一个字母相同,就用第二个字母排序」,以下图的例子,大写 A 在前,小写 a 在后,排序后再按照 123、456 进行排序。

_images/19.png

文本与数组转换

「文本与数组转换」积木可以将带有「分隔符」( 类似空白、逗号、分号...等分隔符号 ) 的文本转换为数组,或是将数组合并为一段文本。

_images/20.png

如果一段文本没有变成数组,其中第二个元素就会是第二个字( 绿色小怪兽就会讲出「果」 ),如果将文字拆分为数组,第二个元素就会是数组中的第二个内容( 红色小怪兽就会讲出「橙子」 )。

_images/21.png

反之如果是将数组合并为文字,可以将分隔符留空,就会看见数组的内容变成一整串的文本,中间不会有逗号分隔,如果带有分隔符( 例如 a ),就会看见结合成的文字中间都有 a 。

_images/22.png

数组长度

「数组长度」积木可以取得数组中内容的总数,如果是空数组则数组长度为 0 。

_images/23.png

因为数组长度表示的是「数组的缺口数」( 数组可以放入多少个元素),所以如果「有缺口」但没有放入元素,仍然会影响数组长度,例如有个四格缺口的数组,但只放入了三种水果,最后呈现出来的数组长度是 4 。

_images/24.png

颜色

通过颜色积木,可以改变小怪兽互动舞台的颜色,或指定实体开发板矩阵 LED 的灯光颜色。

颜色积木清单

_images/upload_90684cbefd049b2c7f29bf1d66f7af70.png

指定颜色

「指定颜色」积木可以让我们通过色彩选取面板,选择对应的颜色。

如果我们指定小怪兽互动舞台的背景为红色,那么执行后,舞台背景就会变成红色。

_images/upload_b6df48315ec88021377d9f3093e9ef79.png

随机颜色

「随机颜色」会在每次执行时,随机从各种颜色中取出一种颜色显示。

_images/upload_62ecdea1b9ed30c1bd93fec9600df9c4.png

如果搭配循环执行后,就能看到小怪兽舞台背景的颜色不断随机变化。

_images/upload_67a8f84a9ce43b92f130c1155cc613d9.gif

RGB 三原色

「RGB 三原色」积木能够指定积木中三原色的数值,直接通过数值来呈现不同的颜色。

三原色表示 红色(Red)、绿色(Green)、蓝色(Blue),三种颜色分别有 256 种从暗到亮的变化,透过三种颜色的混合,就能产生一千六百多万种的颜色。 ( 但人的眼睛无法分辨这么多种颜色 )

_images/upload_257fcab98503c20529714b930af799f2.png

因为颜色有 256 种,对应的数值就是 0 ~ 255,0 是最暗,255 是最亮,输入对应的数值就能产生对应的颜色,举例来说红色 255 搭配绿色 255 就会是黄色。

通常的三原色为「色光」,红色 + 绿色 = 黄色绿色 + 蓝色 = 青色红色 + 蓝色 = 紫色

_images/upload_26a1d5197486dfc82517dfef78aa935e.png

搭配循环积木,就能够做出红色到黄色的颜色转换效果。

_images/upload_f0478b8767b710d98996e73c7ff96844.gif

混合颜色

「混合颜色」积木是指两种颜色积木按照比例混合产生新的颜色,比例为 0~1 之间的数值,数字越小颜色越接近颜色 1,数字越大颜色越接近颜色 2。

如果把颜色 1 设定为红色,颜色 2 设定为蓝色,比例 0.2 的混合颜色就是偏红色的紫色。

_images/upload_8285c81813b251c1d153ca10d771b3db.png

搭配循环积木,就能够做出从红色到蓝色的颜色转换效果

_images/upload_75393c4e2ad3efe1989f87f9906739aa.gif

函数

在计算机中,函数是指一段在一起的、可以做某一件事儿的程序。

函数积木可以帮助我们简化或管理较为复杂的程序逻辑,因为在写程序的时候,常常会遇到需要重复编写并执行的程序积木,如果每重复一次都得重写一次,就会导致整份程序逻辑的混乱复杂,通过函数可以将这些重复的程序集中管理,需要使用的时候再去调用函数,就可以执行内部对应的程序。

函数积木清单

_images/function-01.jpg

建立函数

「建立函数」积木可以将许多重复会用到的程序积木包装成函数。

_images/function-03.jpg

使用建立函数积木并不会执行函数,因为函数是定义「需要执行的内容」,建立完成函数积木内容后,在函数积木的目录里,就会出现对应的执行函数积木,当去使用这块积木才表示执行这个函数。

_images/function-02.jpg

下图建立了 a 和 b 两个函数之后,调用函数 a 和 b,执行后,绿色小怪兽就会说出苹果,红色小怪兽就会说出香蕉。 ( 如果单纯只有建立函数而不拉取出来调用,执行后什么事情都不会发生 )

_images/function-05.jpg

除了单纯的使用函数,我们也可以建立「函数内的参数变量」,点选函数积木前方的小齿轮,就可以新增参数变量。

_images/function-06.gif

新增函数内的参数变量后,执行函数时也会看到放入变量数值的缺口。 ( 函数内有几个参数变量就会有几个缺口 )

_images/function-07.jpg

函数内的参数变量让程序增加了许多弹性,并也可以减少许多重复的程序,举例来说,通过函数和函数内参数变量,就能做出提供参数变量数值,并算出数值总和的函数。

_images/function-08.jpg

建立带有返回值的函数

「建立带有返回值的函数」积木可以让执行的函数,变成单纯的数值,这对于一些复杂的程序应用相当有用。

_images/function-09.jpg

如果使用的是「建立带有返回值的函数」,就会发现执行函数时积木前方多了一个作为组合用的形状。 ( 下图是一段建立带有函数的参数变量的函数 )

_images/function-10.jpg

通过函数的参数变量,搭配函数返回的数值,就能做到依据提供的变量数值不同 ( x、y 不同值 ),而产生不同的结果。

_images/function-11.jpg

在函数内判断并返回值

「在函数内判断并返回值」积木必须和「建立带有返回值的函数」的积木搭配,主要作为判断后要返回什么数值使用。 ( 这个积木也必须放在函数内才能正常运作,如下图示例用法。)

_images/function-12.jpg

通过这个积木,搭配函数内的变量,就可以通过传入的变量数值,最后返回 x 和 y 哪个比较大的结果。

_images/function-13.jpg

因为「函数内判断并返回值」积木具备逻辑判断的功能,所以也可以使用逻辑积木加上一个变量来做判断,就能做出一模一样的效果。

_images/function-14.jpg

数学

数学积木包含了许多数学运算,从基本的加减乘除,到四舍五入、平均值、中位数...等应有尽有,无论是简单的程序或复杂应用,都能通过各式各样的数学运算实现。

数学积木清单

数学的积木分别有数字、运算、基础函数、加和、随机数和尺度转换...等常用的数学运算式。

_images/upload_d1c8bbcfcd83e1a75e18857fdecc1b0f.png

指定数字

「指定数字」积木用来让我们输入数字,可输入整数或是带有小数点的浮点数,常用于运算和判断。

_images/math-02.jpg

取得范围内随机整数

「取得范围内随机整数」积木会指定一个数字范围,在每次执行这块积木时,就会从这个数字范围内取出随机的整数。

_images/upload_29f3e4a7463190ae3f2a9e3b9f031e97.png

搭配「循环无限次」积木和「等待」积木,可以让小怪兽每隔一秒说出一个随机整数。

_images/upload_1a99ebff4f17e890aedc046d6cdfbf13.gif

取得随机分数

「取得随机分数」积木会在每次执行时,随机取得一个 0 到 1 之间的浮点数。

_images/upload_6be241f338bec92416cfdf03610a8eda.png

搭配「循环无限次」积木和「等待」积木,可以让小怪兽每隔一秒说出一个随机浮点数。

_images/upload_0e48c7c544fd464e89cf892aeab62892.gif

数学运算

「数学运算」积木可以针对数字进行加、减、乘、除和乘方五种运算。

_images/math-07.jpg

如果使用多个数学运算的积木,需要注意的是每个运算积木在计算上都会使用括号,类似的运算式有可能得到不同的结果,例如下图积木看起来都是5 + 2 x 2,但因为括号位置的不同,得到的结果也不相同。

_images/upload_6b2f08cc14fd02d7950cd02529ef2f82.jpg

数学运算除了可以放入数字,也可以用于变量的相加,例如指定变量 a 为 5,变量 b 为 3,通过数学运算就能算出 a + b 等于 8。

_images/upload_849725911c5a02d0056710c11cc79394.png

取得余数

「数学运算」积木可以取得两个数字相除所得的余数。

_images/upload_1602c8514bc2334c227b4d36469d3644.png

限制数字范围

「限制数字范围」积木可以设定最大值与最小值,并将数字限制在这个指定的范围内。

_images/upload_e52951bf6667bf3c9391ee0a5e28ee4a.png

四舍五入

「四舍五入」积木可以对带有浮点数的数字进行四舍五入、无条件舍去或无条件进位三种运算,同时亦可选择舍去或进位到第几位小数点。

_images/upload_db4e9b77d848e83b2f870c91d64e7800.png

将需要四舍五入的数字,放在「四舍五入」的积木后方,就可以得到四舍五入之后的结果。

_images/upload_07c8fc616442712daebf914cd03225aa.png

尺度转换

「尺度转换」积木可以将某个尺度区间内的数值,转换为另外一个区间尺度对应数值。

_images/upload_ca5150ec5033e3a47699a541d951e893.png

如下图, 0.5 为 0-1 尺度区间的数值,转换为 0-100 尺度区间得到的结果就是 50。

_images/upload_38b30ddbe84c04c851b6e11b698fca8c.jpg

「尺度转换」积木可以帮助我们完成许多较为复杂的尺度转换,例如 0.5 位于 -5-5 之间,转换到 250-400 之间的数值就是 332.5。

_images/upload_7cbbc2874028f217ed37ef0ef72b4c09.jpg

「尺度转换」积木常常会和「四舍五入」积木搭配使用,建议将「四舍五入」积木放在尺度转换积木前方,因为尺度转换后的数值有可能会带有小数点,转换后再四舍五入能得到较精确的答案。

_images/upload_e1ce4490809efa423df2ed35e25c8b72.jpg

数组运算

「数组运算」积木能针对以数字组成的数组,进行加总、取出最小值、取出最大值、计算平均值、取得中位数、取得比较众数、计算标准差和随机抽取的计算。

_images/upload_bf129e0fe1b5b19e170e69dee966bba4.jpg

在数组运算后方接上数组积木,就可以开始行取值或运算。

_images/upload_768f06c1ab0df9e9ac09b213cbdf6350.jpg

常用数学函数

「常用数学函数」提供常用的数学计算积木,常用数学函数包含以下几种:开根号、绝对值、负数(-)、对数函数(ln)、log10 函数(log10)、指数函数(e^)和10 的几次方(10^)。

_images/upload_d2fe94565c95ebfb3971d8fba23b8aed.jpg

三角函数

「三角函数」积木里头提供了两种三角函数用法,分别是角度 ( sin、cos、tan ) 以及弧度 ( asin、acos、atan ),三角函数可以从下拉选单选择切换。

_images/upload_23b0752c08190b8fb98414980f47d076.jpg

注意,因为JavaScript 网页语言特性,有些情况使用三角函数时,小数点后方会变成无限循环9999,例如sin(30) 应该等于0.5,出来却变成0.49999...,当遇到这种情况,需使用四舍五入的方式才能呈现预期的结果。

_images/upload_e08b1a75c5af43eb95e965088d061f7b.jpg

常数

「常数」积木会表现是一个不会变动的常数数值,常数包含了以下几种:圆周率(π)、指数(e)、黄金分割率(φ)、sqrt(2)、sqrt(½) 和无限大(∞)。

_images/upload_20dde89c350cda10c9fc1b08b0f242d7.jpg

小怪兽互动

小怪兽基本操作

编辑器设计了四只可爱的小怪兽,通过程序积木编排逻辑顺序,就能控制每只小怪兽的说话、声音、互动和行为等动作,甚至能进一步与实体开发板互动,做出更多好玩的有趣应用。

小怪兽积木清单 ( 基本操作 )

基本操作小怪兽的积木分别有讲话、展示图片、情绪、改变位置、改变角度、改变大小、显示隐藏和阶层...等,可以通过这些积木控制小怪兽的外在表现。

_images/upload_ecaf893841c42dfab8dba2e59219b3f0.png

讲话&不讲话

「讲话」和「不讲话」积木可以让小怪兽讲出指定的文字,或不要讲出文字,通过下拉选单也可以选择哪一只小怪兽讲话,或所有小怪兽一起讲话。

_images/upload_2e3b52771cffb4aa57eba477b5c2a786.png

只要在讲话的积木后方,连接指定的文字,执行后小怪兽就会说出指定的文字。

_images/upload_705418bdeba488d8a1aac5daf3ff86f5.png

只要把文字留空,或者使用不说话的积木,就能够让小怪兽不说话。

_images/upload_e559ef990c771072f48b1693c8b762b9.png

展示图片

「展示图片」积木可以让小怪兽展示一张「网络图片」。

_images/upload_b7edb18992b7d500b6902688a5b9e318.png

举例来说,从百度百科上搜寻[蒙娜丽莎],可以得到这张图片的「网址」,复制图片网址,贴到小怪兽展示图片的文字空格内,执行后,就会看见小怪兽展示这张图片。

目前图片格式仅支持 jpg、jpeg、png、gif(图片网址结尾必须带有图片格式才能显示图片)

_images/upload_0e42941e1908cd0eee54be33f33dc605.png

情绪

「情绪」积木可以改变小怪兽的情绪,包含开心、惊讶、生气、难过和随机情绪。

_images/upload_590cfe6b6bb11b37e0785e45a28d3591.png

选择对应的小怪兽 ( 也可以四只同时 ),选择对应的情绪,执行后就会看见小怪兽的情绪变化。

_images/upload_1ab6008309379d6e26ac09ad81d20011.png

改变位置

「改变位置」积木可以指定小怪兽改变目前的位置,选项有往上、往下、往左、往右、随机或朝向鼠标方向。

_images/upload_64c0e2ae93164965ef2800de7c4d081f.png

如下图,搭配「循环十次」和「等待 0.1 秒」积木,就能够让小怪兽往右上方移动。

_images/basic-10.gif

如果使用「无限循环」积木,搭配「朝着鼠标位置」的设定,就能够让小怪兽追着鼠标移动。

_images/basic-11.gif

定位

「定位」积木能够把小怪兽摆放到指定的坐标位置。

_images/basic-12.png

怪兽的座标系统采用笛卡尔直角座标系统 (直角座标系统),往上y 为正,往右x 为正,而(0,0) 原点位在怪兽互动舞台的左下角,指定小怪兽xy 坐标,执行后小怪兽就会出现在指定的位置。

_images/basic-13.jpg

旋转角度

「旋转角度」可以指定小怪兽改变目前的角度,选项有往左或往右。

_images/basic-14.png

搭配「无限循环」积木,就能让小怪兽不断的每隔 0.1 秒旋转 10 度。

_images/basic-15.gif

面朝方向

「面朝方向」角度可以指定小怪兽旋转的角度,顺时针为正,逆时针为负。

_images/basic-16.png

因为「面朝方向」是指定一个角度,如果要做到和前一个积木「旋转角度」一样的效果,可以使用变量搭配「无限循环」积木,在每一次执行时修改变量数值即可。

_images/basic-17.gif

自动面朝鼠标方向

「自动面朝鼠标方向」积木能让小怪兽转到鼠标所在的方向,有自动和停止两个选项。

_images/basic-18.png

因为「自动面朝鼠标方向」只会执行一次,所以如果要让小怪兽不断的面向鼠标,就必须搭配无限循环的积木,如下图,执行后小怪兽就会自动面向鼠标旋转。

_images/basic-19.gif

取得座标和角度

「取得座标和角度」积木能够读取小怪兽当前的 X 座标、Y 座标和旋转角度。

_images/basic-20.png

下图的例子,就能让小怪兽自己讲出自己的 X 座标、Y 座标和旋转角度。

_images/basic-21.jpg

尺寸放大缩小

「尺寸放大缩小」积木可以指定小怪兽改变目前的大小,选项有放大或缩小。

_images/basic-22.png

搭配「循环十次」和「等待 0.1 秒」积木,执行后,就能够让小怪兽逐渐变大。

_images/basic-23.gif

尺寸百分比

「尺寸百分比」积木可以指定小怪兽放大缩小的百分比。

_images/basic-24.png

由于 100% 表示原本怪兽大小,所以 200% 就会是一倍大,50% 则是会缩成 1/2 大小,下图通过尺寸百分比,分别让四只小怪兽呈现不同尺寸大小。

_images/basic-25.jpg

显示/不显示

「显示/不显示」积木可以指定小怪兽是否显示在互动舞台区。

_images/basic-26.jpg

阶层

「阶层」积木可以指定小怪兽排列的阶层,最上层在最前面,最下层在最后面。

_images/basic-28.png

通过「循环」以及「等待」积木,能够让小怪兽的阶层依序显示在最前面。

_images/basic-29.gif

回到原始状态

「回到原始状态」积木可以让小怪兽回到初始状态,初始状态包含不说话、预设座标、预设旋转角度和预设尺寸大小。

_images/basic-27.png

小怪兽互动&舞台

除了可以设定小怪兽的位置或大小,编辑器更能让我们与小怪兽互动,例如用鼠标点击小怪兽、小怪兽互相碰撞、碰撞舞台画面边缘...等。

小怪兽积木清单 ( 互动&舞台 )

互动&舞台的积木分别有鼠标点击小怪兽、鼠标触碰小怪兽、小怪兽互相碰撞、小怪兽碰撞舞台边缘、碰到舞台边缘就反弹、更换舞台背景和设定为全屏幕。

_images/event-01.png

鼠标点击

「鼠标点击」积木可以在鼠标点击小怪兽时,让小怪兽做指定的事情。

鼠标点击积木「不需要放在循环内」就可重复检测,并在后台执行。

_images/upload_bd5d493660fdf95650cfd71875b09f68.png

下图的例子,点击绿色小怪兽时会说话,点击红色小怪兽会放大,点击黄色小怪兽会旋转,点击蓝色小怪兽会改变情绪。

_images/event-03.gif

鼠标触碰

「鼠标触碰」积木包含两个行为动作,分别是鼠标触碰到小怪兽要做什么事,以及鼠标离开小怪兽后要做什么事。

注意,离开的行为动作一定会接在触碰之后,鼠标触碰积木「不需要放在循环内」就可重复检测。

_images/upload_6eee2e14f316f79216ef294e531284c1.png

下图的例子,在鼠标触碰到绿色小怪兽时,小怪兽的情绪会开心,鼠标离开后小怪兽又恢复正常的情绪。

_images/upload_bd4c4a7f42b86231ee1d30f7da6d1681.gif

互相触碰

「互相触碰」积木可以检测小怪兽彼此之间是否有触碰。

「互相触碰」积木「只会检测一次」,必须搭配循环,才能重复检测。

_images/upload_eab6bd21822786b42a47fe7afd4e3edc.png

以下图为例,搭配「无限循环」积木就能不断检测小怪兽是否互相触碰。用鼠标拉动小怪兽,当两只小怪兽相碰时,小怪兽就变成惊讶的情绪,分开后又恢复正常。

_images/event-07.gif

触碰舞台边缘

「触碰舞台边缘」积木可以检测小怪兽是否触碰到互动舞台的四个边,或指定检测碰到上、下、左、右四个边的行为。

「触碰舞台边缘」积木「只会检测一次」,必须搭配循环,才能重复检测。

_images/upload_d046836899bee6928e3cb4e801b7c6a2.png

以下图为例,搭配「无限循环」积木就能让小怪兽碰到舞台画面上边缘或下边缘时,变成开心的情绪,碰到左边缘或右边缘则呈现生气的情绪,没有碰到时则是正常情绪。

_images/event-09.gif

触碰舞台边缘就反弹

「触碰舞台边缘就反弹」积木是「触碰舞台边缘」积木的简化版,将碰触后的行为单一化为「反弹」,反弹表示位置的相反,如果碰到舞台左右两侧,则小怪兽移动的X 方向会相反,如果碰到舞台上下两侧,则小怪兽移动的Y 方向会相反

「触碰舞台边缘就反弹」积木「只会检测一次」,必须搭配循环,才能重复检测。

_images/upload_9cc804bee48cd25db97ef0415aa5de8d.png

以下图为例,搭配「无限循环」积木碰到舞台边缘时就会反弹。

_images/upload_2054073407edffc93259cee64ea8d559.gif

更换舞台背景颜色或图片

「更换舞台背景颜色」和「更换舞台背景图片」,可以改变怪兽舞台背景为指定的颜色或图片,图片只要填入图片网址,执行后就会更换。 ( 图片支持 jpg、jpeg、png 和 gif )

_images/upload_a0ffebb197b6a1b7e624df95575db57e.png

举例来说,找一张清明上河图的图片网址,将网址贴上在背景图片的文字积木内,执行后就会看见舞台背景变成清明上河图了。

_images/upload_0a5192dcef98295928291f37dc3aa941.png

设定舞台为全屏幕

「设定舞台为全屏幕」积木不影响任何操作,只会在「执行时」把怪兽互动舞台变成全屏幕大小。

_images/upload_c7f81fc1821ae721f0a1ae538cf657d7.png

如果不想使用该功能,也可以手动操作,点选怪兽互动舞台右上方的小按钮,也可以进行全屏幕的切换。

_images/event-15.jpg

取得舞台尺寸

「取得舞台尺寸」积木可以取得当下怪兽互动舞台的宽度或高度。

_images/upload_3f0c3896ee92a0b281e3cb96344ac1f5.png

下图的例子会在执行的时候,绿色小怪兽讲出舞台宽度,红色小怪兽讲出舞台高度。

_images/upload_990e0968794979db21161874e12d667e.png

系统功能

键盘行为

鼠标和键盘是电脑必备的两大输入装置,熟悉了键盘的输入方式,就可以使用键盘进行简单交互,无论是要做成钢琴键盘还是游戏控制器都轻而易举,同时也可以搭配文字的输入,做出许多意想不到的互动效果。

检测键盘行为

「检测键盘行为」积木可以检测电脑键盘上大多数按键的按下与放开。

检测键盘行为积木处于随时检测的状态,不需要搭配无限循环

_images/upload_cab0d8638477e4439b9bf927c1b71ace.jpg

用过按下和放开两种行为,就可以在按下键盘的同时,让小怪兽说出对应按键名称,放开键盘后就不说话。

_images/upload_f2b9f50319a3b47a1adff6cafdc0dc7a.gif

按下键盘的行为会「连续执行指令」,类似在打字的时候,如果按着某个按键不放,画面中就会出现一连串这个按键的文字,例如下图,设定按下键盘A 的时候小怪兽会往左旋转,执行后,持续按住A 怪兽就会持续旋转,放开A 怪兽就会停止,不需要设定放开的指令。

_images/upload_ab29dcdc4cf79cb980a9bac21baf2d2a.gif

键盘控制小怪兽移动

积木可以同时检测多个键盘控制行为,通过键盘行为就能很简单的做出「按下上下左右键,小怪兽就会上下左右移动」。

_images/upload_307f1e13b196d6398223719f42edd2e3.gif

日期&时间

日期与时间的积木,可以读取电脑的日期和时间并在网页上显示,可以搭配循环、开关或键盘...等行为,做出时钟、码表、游戏计时...等应用。

取得目前日期与时间

「日期」积木能够取得目前的年、月、日,「时间」积木能够取得目前的小时、分钟、秒,小时采用 24 小时计算,如果是下午三点会显示 15。

_images/upload_cb96a39bbcf323c24bf79ae38d32fe6c.png

时钟

所下图执行该积木即可取得时间,「时间只会取得一次,所以需要搭配「无限循环」积木,如下图」。

_images/upload_27a51c6d97093758206f6fa3e30daee6.gif

闹钟

延伸时钟的范例,搭配逻辑的积木,执行后就能做到在某个时间点产生提醒的闹钟功能。

判断时间到了之后,可以通过「停止循环」积木将时间停止,避免时间继续显示。

_images/upload_966171ad34d632dd98a6bcde20c68074.gif

对话框输入文字

在编辑器中如果使用了「对话框输入文字」的积木,执行后,在怪兽互动舞台的画面底部,就会出现输入文字的对话框,通过输入文字就能进一步与开发板或小怪兽互动。

积木清单

对话框输入文字的积木有两种,第一种是「在对话框输入文字」,执行后会出现用来输入文字的对话框,第二种是「输入的文字」,执行后会取得所输入的文字。

_images/upload_599cb0bbf41d4332295199f7642c7af4.png

对话框输入文字

「对话框输入文字」积木属于「执行完成才会继续执行后方程序」的类型( 点击前方问号会提示),当编辑画面中有这块积木,执行时当程序遇到这块积木会暂停,直到输入文字后才会再继续

_images/upload_1cce5797dbfdfba59cfab632a515679b.png

举例来说,下方的程序里的小怪兽在执行后不会讲话,直到输入文字后才会说话。

_images/upload_b54e5e45cb2c7400d2f5f7027ac9a083.gif

获取输入的文字

「输入的文字」积木一般都放在「对话框输入文字」积木之后,用来获取输入的文字,将上述的例子稍做修改,如下图,就能够再让小怪兽讲出输入的文字。

_images/upload_d6799d41c2963f9eea126cdc0b912e60.gif

重复输入文字

搭配「无限循环」积木,就能将上述的例子修改成「不断输入文字」的版本。

_images/upload_828002a7cd3adda00deac7e11e91db74.gif

一问一答

通过输入文字的方式,能够轻松实现「一问一答」的效果,在输入文字积木之前摆放小怪兽询问姓名的文字,执行后会停留在输入文字的阶段,输入文字之后,通过「建立字串」积木,让小怪兽说出「XXX 你好」的文字组合。

_images/upload_449cda52190c8c863ac236a261af0653.gif

音效 & 语音

特殊音效

在「播放 XX 音效」积木中内置了许多有趣的特殊音效,里头包含了动物音效、环境音效、人类生活音效...等,使用不同音效和小怪兽、开发板组合,就能实现许多丰富的应用。

积木清单

特殊音效分成三个项目,分别是动物、人声和特殊音效。

https://codimd.s3.shivering-isles.com/demo/uploads/upload_01ae1bf1b04810c7cb106aab9bdabf91.jpg

点击小怪兽发出音效

搭配「点击小怪兽」积木,点击执行后,用鼠标点击小怪兽就会发出对应的特殊音效。

https://codimd.s3.shivering-isles.com/demo/uploads/upload_f34f3980273799bfb98a1058ece8e423.png

替小怪兽的反弹加入音效

点选右上方选单「范例」,打开范例清单。

https://codimd.s3.shivering-isles.com/demo/uploads/upload_1010989345dc7e884addd9c63c571e1a.png

打开范例清单后,开启基础操作里的「小怪兽移动时碰到边缘反弹」。

https://codimd.s3.shivering-isles.com/demo/uploads/upload_6288679620bdf7de696162aeb65f8e45.png

开启范例后,找到「当绿色怪兽碰到舞台画面的四边缘」选择在积木中加入,并在执行的区域内加入特殊音效,执行后,当绿色怪兽碰到画面边缘时,就会发出特殊音效。

https://codimd.s3.shivering-isles.com/demo/uploads/upload_b9ab26b295f96de6e39a2c3e54f09697.png

开发板功能

开发板

这里提供了三种控制开发板的方式,分别是「模拟器」、「USB」和「Wi-Fi」,模拟器能够在没有硬件的情况下模拟硬件,USB 可以在没有网络的情况下,通过 USB 连接操控。而Wi-Fi 则可以进行无线远程操控板子,通过三种不同操控方式的互相搭配,可以在各种场景下控制开发板。

_images/upload_a305960c5d3186e1705fbd0719edd5dc.jpg

使用方式

下拉选单选择「模拟器」,表示使用右侧的「虚拟开发板」,开发板积木里所有能控制的元件,都会和右侧的虚拟开发板对应,例如绘制一个图案,执行后,虚拟开发板就会显示图形。

_images/upload_ed5475fb209b45ed098fe98244184228.jpg

下拉选单选择「USB」,表示使用「USB 线」连接「开发板」必须使用「编辑器(安装版)」操作,例如绘制一个图案,执行后,通过 USB 连接的开发板就会显示图案。

「编辑器(安装版)」请参考:编辑器介绍

_images/board-03.jpg

下拉选单选择「Wi-Fi」,表示使用「Wi-Fi」连接「开发板」,也就是通过每块开发板的 Device ID 进行控制,只要知道 Device ID,不论开发板身在何处,都能远程操控。

开发板 Device ID 请参考:开发板设置

_images/board-04.jpg

控制多块开发板

编辑器可同时控制多块开发板,只需要在编辑画面里放入开发板,指定开发板的操控方式,执行后就会看到所有开发板同时发生变化,下图的例子,在同一个编辑画面里,让一块模拟器开发板和两块Wi-Fi 开发板,同时呈现花朵图案。

多块开发板 最多只能包含一块「模拟器」开发板和一块「USB」开发板,「Wi-Fi」开发板则没有数量限制

_images/board-05.jpg

在控制多块开发板的情况下,不支持使用函数控制,要特别注意!

_images/upload_d910330f4e5dadc186b69c21c4ff8645.png

但不可以在多个开发板中使用 函数 控制硬件外设,如下图。

_images/upload_ea4ff5dace7523836f3e5e57283affda.png

因此若是想要做到同样的效果,此时的做法应该要如下:

_images/board-07.png

矩阵 LED

开发板的正中央内嵌了一个由 25 颗矩阵 LED 组成的的 LED 矩阵 ,每个 LED 都可通过红、绿、蓝三种颜色进行混合产生各种不同颜色,让指定位置的 LED 显示指定的颜色并组合,就能显示各种图案。

矩阵 LED 积木清单

矩阵 LED 积木清单包含显示颜色、关灯、绘制图案、预设图案、指定第几颗灯的颜色、跑马灯和亮度等积木。

_images/upload_f63f939496f887fe4786365a69edc0fc.png

使用矩阵 LED 积木必须搭配「开发板」积木,选择模拟器,执行后可以控制右侧模拟器的 LED 矩阵,选择 USB,执行后会通过 USB 连接方式控制实体开发板,选择 Wi-Fi 则可通过 Wi-Fi 指定 Device ID 操控开发板。

_images/upload_a405d0e0455fd644717101c3751df0a6.png

显示颜色

「显示颜色」积木可以让 25 颗灯同时亮起指定的颜色。 ( 若选择黑色,效果等同不亮灯 )

_images/upload_e2315998a8cfe9acedd68bec5112c70c.png

开发板选择模拟器,显示颜色积木选择红色,执行后,虚拟的开发板 25 颗灯都变成红色。 ( 若手边有开发板,可以使用 USB 或 Wi-Fi 连接控制 )

_images/upload_081903273b3fd8d4f529c88856192fe4.png

绘制图案

「绘制图案」积木能够自定义每颗灯不同的颜色,绘制一个 5x5 的图案。

_images/upload_c852f4d68838e6c5d0016e01560b9f9e.png

点击积木上方的颜色区块就能选择不同颜色,如果是同颜色,重复点击就可以还原为黑色 ( 直接使用黑色也是同样的效果 )。

_images/upload_0b38e47c44fb3a3d7755e7908cea45e5.gif

例如绘制一朵花,让花瓣为红色,花梗和叶子为绿色,执行后,虚拟的开发板就会呈现一朵彩色的花。

_images/upload_32a049fb957b51d0cc47af0c38baf1d1.png

预设图案

「预设图案」积木提供 60 种预设图案,以及一个随机图案选项 ( 60 种图案随机取出一种 )。

_images/upload_9b89853f2ac3a318d844980d02b42f0e.gif

选择图案和颜色,执行后,虚拟开发板就会出现对应的图案和颜色。

_images/upload_5a1b8919a68c65b2b25529c2278016ea.png

显示一个字

「显示一个字」积木可以显示单个大小写英文字母、数字或标点符号 ,并指定显示的颜色。 ( 不支持显示中文 )

_images/upload_d8c17706d60bfdaddf9a1997ad2ebd62.png

在文字积木输入字母或数字并指定颜色,执行后就会看到指定颜色的字母或数字出现。

_images/upload_2810b8f54fbf9129c79c93a919bfa638.png

跑马灯

「跑马灯」积木可以通过跑马灯的方式,以指定的颜色显示一串文字,跑马灯可以只进行一次或无限次重复播放,并能设定文字移动的速度。 ( 不支持显示中文 )

_images/upload_879d253f34acc1b464e08ef98965e7f9.jpg

如果设定跑马灯次数为「一次」,跑马灯积木会是「执行完成才会继续执行后面积木程序」的类型( 点击前方问号会提示),跑马灯结束后才会接着执行其他程序,若设定为「无限次」,后台程序会继续执行,但和LED 矩阵有关的行为会被跑马灯所取代,使用上要特别注意。

_images/upload_7b9090bfacbbbdf3801cf8f77112c4bc.png

下图的例子,执行后会先出现红色 Hello 文字的跑马灯,结束后紧接着出现绿色笑脸。

_images/upload_6fbc7a9ca95c10b182cce3a2b44b1952.gif

矩阵 LED 控制灯号

「矩阵 LED 控制灯号」积木可以控制矩阵 LED 指定灯号的运行。

_images/upload_a360aaa10807f6cb8c8e2facc7445288.png

矩阵 LED 的顺序对应到 开发板的灯号顺序,开发板灯号 1~25 的顺序为从左到右、从上到下。

_images/rgbled-matrix-16.jpg

举例来说,若设定矩阵 LED 的三个值为红色、绿色和蓝色,开发板的第 1~3 个灯就会呈现对应的颜色。

_images/upload_392fba6ea5f3fbbc97935255cdfe03de.png

如果是多维矩阵 LED ,会按照矩阵 LED 元素的顺序进行显示,若元素内容留空,该颗 LED 会呈现熄灯状态。

_images/upload_249539e18180c1815e49ef8dd3e51120.png

第几颗灯

「第几颗灯」积木可以指定第几颗灯的颜色。

_images/upload_2f91b361f5363749fb2de4332e041c7b.png

第几颗灯的顺序对应到开发板的灯号顺序,开发板灯号 1~25 的顺序为从左到右、从上到下。

_images/rgbled-matrix-16.jpg

分别指定不同位置的灯号颜色,执行后就会看见指定位置的灯号亮起。

_images/upload_670bd7d51c9f594273b0a4329f5a7511.png

X、Y 座标控制灯号

「X、Y 座标控制灯号」积木可以通过 X 和 Y 的座标值指定灯号的颜色显示。

_images/upload_f467507ed38a3018e166a1a4d806ef7b.png

开发板的 X、Y 座标以左上角为 ( 1, 1 ),往右 X 加 1,往下 Y 加 1,依此类推。

_images/rgbled-matrix-22.jpg

分别指定不同 X、Y 的灯号颜色,执行后就会看见指定位置的灯号亮起。

_images/upload_6e19592bbea111a87ba2441f6b44f05c.png

亮度

「亮度」积木可以控制「全部 LED 灯」的亮度,该积木无法指定单一颗灯的亮度,亮度最暗到最亮的数值为 0 ~20,预设值 10。

_images/upload_e531c3542454cd50f41475c8f89ae4f9.png

关灯

「关灯」积木可以关闭「全部 LED 灯」,效果等同于把 25 颗灯的颜色同时设定为黑色。

_images/upload_d8f9d8823ceebcb3763d556a5b0bb4a8.png

按钮开关

在开发板正面的左右两侧,有两颗按钮开关,通过使用这两个开关,可以打造真实的游戏遥控器或智能家居控制的应用,更符合物联网的使用场景。

按钮开关积木说明

按钮开关积木可以指定「按下、放开、长按」三种开关行为,三种行为可分别套用到 A、B 或 A 和 B 同时操作。 ( 长按的定义为持续按下一秒 )

_images/upload_06284e2585e416a5ddfd913d0ca77e09.jpg

使用按钮开关积木必须搭配「开发板」积木,选择模拟器,执行后就可以使用鼠标点击模拟器上的按键,选择 USB,执行后会通过 USB 连接方式控制实体开发板,选择 Wi-Fi 则可通过Wi-Fi 指定 Device ID 操控开发板。

_images/upload_029e0e6306c329860727021f5db13f2f.jpg

按下开关改变 LED 矩阵图案

在编辑画面放入按下A、按下B 和按下A+B 的积木,接着分别在各自的区块内放入LED 矩阵显示图形的积木,执行后,如果是使用模拟器,就可以用滑鼠点击 A 、B 或 A+B 按钮查看变化效果,如果是使用实体开发板,则可以直接用手指按压开关。

模拟器里的 A+B 按钮开关,只有在编辑画面有 A+B 按钮开关的积木时才会出现。

_images/upload_11fe6d329a7e69cc40c5499d13512724.gif

按下、放开和长按

通过开关的按下、放开和长按三种行为,就能做出「按下时有图案,变成长按后图案会变色,最后放开开关就会关灯」的范例,执行后,如果是使用模拟器,就可以用鼠标点击 A 按钮查看变化效果,如果是使用实体开发板,则可以直接用手指按压开关。

_images/upload_2bc8f9ecd689421f9d4a0d8dfb538eb3.gif

光线&温度

开发板内有两个光敏传感器,以及一个热敏电阻,光敏传感器可以检测环境光线的流明数值,热敏电阻则可检测到小数点两位的温度变化,通过对光线和温度的检测,就能做出环境监控相关的应用。

积木清单

检测光线分别可以检测左上和右上的亮度变化,检测的单位为流明,数值区间为 0~1000 的整数,温度检测的单位为 ℃(摄氏度),数值可到小数点两位。

_images/upload_67a10398c136bfeed9a746d768e4f45a.png

检测光线和温度积木必须搭配「开发板」积木,选择模拟器,执行后可以使用鼠标拖拉模拟器的灯泡或火焰。

_images/upload_1715ac062f8e311ec52e5f0138674042.png

检测光线

「检测光线」积木使用时只会检测一次,搭配「无限循环」积木就能进行连续检测。

_images/upload_0be0e23afc298517fc1d3c103908efa5.png

执行后,如果是使用模拟器,画面里会出现一个「灯泡」图案,拉动「灯泡」靠近画面里的光敏电阻,就能模拟光线的变化,如果是使用实体开发板,可用光线照射光敏电阻观察光线变化。

_images/photocell-thermistor-03.gif

了解光线检测原理后,若搭配简单的「逻辑」判断,就能做出小夜灯的效果,以下图的例子而言,只要左边或右边的任何一个光敏传感器检测到亮度大于等于600 流明,就会熄灯,反之左右两边只要同时检测的数值小于600 流明就会亮白灯。

_images/upload_d0f3308a6f71417b07c312d0429679f1.gif

检测温度

「检测温度」积木使用时只会检测一次,搭配「无限循环」积木就能进行连续检测。

_images/upload_d198ba23a25ac94a4765d49bcffad040.png

执行后,如果是使用模拟器,画面里会出现一个「火焰」图案,拉动「火焰」靠近画面里的热敏电阻,就能模拟温度的变化,如果是使用实体开发板,可用手指按压热敏电阻、或用嘴对着热敏电阻吹气,就能观察温度变化。

_images/upload_dfdc520d3406cdfc8e0a8f0a5047b29b.gif

了解温度检测原理后,若搭配简单的逻辑判断,就能做出用颜色反映温度的效果,当温度大于等于 50 度就呈现红色,反之小于 40 度就是蓝色。

_images/upload_08ab033663e27f5b4224f9244860c3d3.gif

音乐&声音

开发板内有一个微型蜂鸣器,可以发出三个八度音阶的单一声响,通过不同音符代码的组合,或者搭配内置的范例音乐,就能让开发板发出各种美妙的旋律。

音乐&声音积木清单

音乐&声音的积木包含演奏某个音阶、休息、预设音乐和停止演奏...等积木。

_images/upload_d81f8c3e1d6daeb5fc4f33be0b754585.png

音乐&声音积木必须搭配「开发板」积木,选择模拟器,执行后可以听见电脑喇叭发出声音,选择USB,执行后会通过USB 连接方式控制实体开发板,让开发板的蜂鸣器发出声音。
演奏音阶

「演奏音阶」积木可以演奏三个八度音阶,同时亦可指定每个音阶的拍子,拍子分为 1/16、1/8、1/4、1/2、1 和 2 拍。

_images/upload_c9fa8b5fa500b5fb755c1633c03bce49.jpg

点选音阶的选项会弹出一个虚拟的钢琴键盘,使用鼠标移到琴键上,电脑的喇叭就会发出对应的声响。

_images/upload_46fe754af544df24c66e0910e7f2f19c.gif

在音阶的缺口,可以分别放入「音阶」和「休止符」积木,后面的缺口只能放入「拍子」积木。

_images/upload_027f5c26da138c9ce4971dd4532c8178.png

放入好几个音阶,执行后可以听到一个音阶接着一个音阶播放。

_images/upload_2e3c85ed2d24bf38109c154dd60bd828.gif

由于「演奏音阶」积木会是「演奏完成才会继续执行后方程序」的类型,若程序放在音阶之后,在所有音阶演奏完成后,才会执行后面程序。

_images/upload_92adfef7e8a7b2e550d142129807d807.gif

「演奏音阶」积木也可以搭配「无限循环」积木,做到不断重复播放一段旋律的效果。

_images/upload_5f262a6ff6b57814d1c4f418f1425e17.gif

「音阶」积木指出数组的使用,根据数组的排列组合,就能自行编辑音乐并重复使用,下图的例子,分别将音阶和拍子独立成两个数组。

使用「数组」的情况下,若音阶数量少于拍子,多出来的拍子会采用最后一个音阶播放,若拍子数量少于音阶,多出来的音阶会采用最后一个拍子播放。

_images/upload_55969f257d9c76d8d2a7c66414e0c373.png

演奏休息

「演奏休息」积木表示该拍子没有声音,等同于使用「演奏音阶」积木搭配「休止符」积木。

_images/upload_553dd18457d0c23e596671b25ece4fc2.png

_images/upload_599ca13a4d02c7810f3c1b90a53530c2.gif

演奏音乐

「演奏音乐」积木包含超级玛丽、超级玛丽和弦、真善美、哥哥爸爸真伟大和小叮当五首音乐,可以独立使用或搭配「音阶」积木使用。

_images/upload_1a9af3f10689c6827d63128096f46e0d.png

由于「演奏音乐」积木会是「演奏完成才会继续执行后面程序」的类型,若有音阶或其他程序放在演奏音乐之后,音乐演奏完成后,才会执行后面的程序。

_images/upload_03b4c735d2fcf7d21b04c430c96f3766.gif

停止/暂停/继续演奏

「停止/暂停/继续演奏」积木可以控制音乐演奏的行为。

_images/upload_1ab3917e21aed65cd39b6e0dfab6d380.png

下图的例子通过开发板的按钮开关控制音乐播放,A 和 B 同时按下时开始播放,播放进行中按下 A 就会暂停,按下 B 就会继续播放。

_images/buzzer-14.gif

如果要将「音乐」、「音阶拍子」积木混合控制,在切换音乐之前加入「停止播放」积木,就可完全停止现有的音乐并进行切换。

_images/upload_ebad84f9b0d0904fe82e662ec2d62282.png

运动 & 姿态

开发板内有一个MPU-9250 九轴传感器,除了可以检测空间内的加速度与旋转,用作体感检测、体感游戏...等应用之外,更能通过磁力计的辅助检测,实现检测姿态角度、指南针...等应用。

九轴体感检测积木清单

九轴体感检测积木有两种,一种可检测指定的动作,另一种则可取得九轴感测器的数值。

_images/upload_18c7a52b17ac3acd71b2e3e17dace35c.png

九轴体感检测积木必须搭配「开发板」积木,选择模拟器时无法取得九轴体感数值,但可以通过指定动作的按钮模拟对应动作,选择USB,执行后会通过 USB 连接方式控制实体开发板,选择 Wi-Fi 则可通过 Wi-Fi 指定 Device ID 操控。

_images/upload_0cc551d1867973ce68e94649ceaba3ab.png

检测指定的动作

「检测指定的动作」积木能检测静止、晃动、正面朝上、背面朝上、向后向前翻转、向左向右翻转、向左向右旋转、指向东西南北...等14 种开发板动作。

_images/mpu9250-03.jpg

下图的例子,开发板往右旋转会出现向右的绿色箭头,开发板往左旋转会出现向左的蓝色箭头,如果开发板晃动则会出现红色笑脸。

_images/upload_53b4a76c4c94b0f3c80d1a2a84509995.png

如果是使用模拟器,执行后再开发板的右侧会出现一排按钮,并用文字提示正在检测的指定动作,以上图的例子而言,表示正在检测向右旋转、向左旋转以及晃动。

_images/20190806100154.png

取得九轴传感器的数值

「取得九轴传感器的数值」积木能够取得加速度、磁力计、陀螺仪以及水平旋转、前后左右翻转的数值。 ( 模拟器无法模拟此块积木,必须使用实体开发板 )

_images/20190806100231.png

加速度计

加速度计主要检测x、y 和z 三轴直线移动时「瞬间」加速度变化,将开发板正面朝上,金手指引脚朝向自己,垂直上下的方向为z 轴( 往上为负,往下为正),水平左右为x 轴( 往左为负,往右为正) 水平前后为y 轴( 往自己的方向为负,远离自己的方向为正)

由于检测的数值为「加速度」,在启动或停止的瞬间,可能会产生反向的加速度( 就如行驶的公车突然煞车或启动,乘客会往前倾或后仰),因此在开发时要透过一些逻辑判断来排除,或避免瞬间太大的启动与停止动作。

_images/mpu9250-07.jpg

由于「取得九轴传感器的数值」积木使用时只会检测一次,搭配无限循环便可连续检测,执行后上下左右挥动 开发板,就能看见小怪兽讲出加速度的数值。

因为所在位置以及传感器初始化校准的不同,每块开发板在启用加速度检测时,都会有些细微的误差,Z 通常都会是负一千多( 单位为mg,1 g 通常为一个重力参数),X 和 Y 通常会在200 ~ -200 之间,此时可以拿起开发板上下左右挥动,就会看见数值发生变化,由于所检测的数值为「加速度」,因此当开发板没有移动或等速移动的时候,加速度会保持在一个稳定的数值区间内。

_images/upload_adc1df866d899ff6c826881e5724c6f2.gif

陀螺仪

陀螺仪则是检测旋转时「瞬间」的角度变化,如下图所示,将开发板正面朝上,金手指引脚朝向自己,绕着z 轴旋转为yaw ( 顺时针旋转为正,逆时针旋转为负),绕着x 轴旋转为roll ( 顺时针朝自己旋转为负,逆时针旋转为正) 绕着y 轴旋转为pitch ( 顺时针旋转为正,逆时针旋转为负)

_images/upload_f33a260fb25110b8707be947e7f91db1.jpg

搭配无限循环便可连续检测,执行后转动开发板,就能看见小怪兽讲出陀螺仪的数值,因为是瞬间角度变化,所以当我们停止转动,角度就会回归启动时的数值 ( 预设是0,若数值不为零,请重插开发板USB 线,重新启动再试一次)。

_images/mpu9250-10.gif

姿态角度 ( roll、pitch、yaw )

姿态角度主要通过加速度计和陀螺仪的数值,组合成可以检测开发板前后翻转( roll )、左右翻转( pitch ) 和水平旋转( yaw ),将开发板正面朝上,金手指引脚朝向自己,绕着z 轴旋转为yaw ( 逆时针旋转角度递增,区间为-180~180 度),绕着x 轴旋转为roll ( 顺时针旋转角度递增,区间为-180~180 度) 绕着y轴旋转为pitch ( 逆时针旋转角度递增,区间为-180~180 度)

_images/upload_a5db6cd2569365f61ccfd2d15b87add1.jpg

搭配无限循环便可连续检测,执行后转动开发板,就能看见小怪兽讲出姿态角度的数值

_images/upload_0ec13f302c1e1893b1f0ff6cf003f514.gif

磁力计

磁力计可以检测所在磁场的变化( 主要是针对地球磁场),将开发板正面朝上,金手指引脚朝向自己,垂直上下的方向为 z 轴( 往上为正,往下为下) ,水平左右为 y 轴( 往左为正,往右为负) 水平前后为 x 轴( 往自己的方向为负,远离自己的方向为正)

_images/mpu9250-11.jpg

使用磁力计之前,需要对开发板进行「8 字校正」,将开发板插上电并拿起开发板,在空中画出8 的形状进行校正,若遇到不准确的状况,进行8字校正后就会准确许多。

_images/mpu9250-12.jpg

搭配无限循环便可连续检测,执行后转动或移动开发板,就能看见小怪兽讲出磁力计的数值( 测试时可以拿磁铁靠近,会发现显著的数值变化,但因为磁铁会干扰磁力计,使用磁铁后需要重新进行8 字校正还原初始状态 )。

_images/mpu9250-13.gif

电子罗盘

电子罗盘为磁力计的延伸应用,使用前需要对开发板进行「8 字校正」,8 字校正后可以做为指南针,检测东西南北方位,将开发板正面朝上,金手指引脚朝向自己,开发板的顶端指向正北方,正北方角度约为0,正东方角度约为90,正南方角度约为180 或-180,正西方角度约为-90

_images/mpu9250-14.jpg

下图的范例,除了让绿色小怪兽讲出方位角,更进一步通过逻辑判断,让红色怪兽说出东西南北的方位。

范例下载:指南针 ( 使用鼠标右键另存新档 )

_images/mpu9250-16.gif

_images/upload_d03b524811b53e6aad51ddd14be958ab.png

输入 & 输出

在 Web:Bit 开发板底部边缘有一排有 25 个金属接触点,这些金属接触点称为「引脚」,或通俗一点也可称呼「金手指」。 引脚包含了 5 个标注 0、1、2、3V 和 GND 的大引脚,以及其他 20 个未标示号码的小引脚,除了可以使用 鳄鱼夹 操作大引脚,也可以使用拓展板 搭配杜邦线操作小引脚,通过引脚的搭配,就能灵活的操作各种外接元件与传感器。

I/O 引脚对照表(以下引脚均为 pin Name,例如1为P1)

_images/index-04.jpg

I/O 引脚积木清单

I/O 引脚积木包含模拟(Analog)与数字(Digital )的相关「输入」和「输出」共四种积木。

_images/io-pin-03.jpg

「I/O 引脚」积木必须搭配「开发板」积木,且并不支持模拟器,只支持 USB 与 Wi-Fi 控制。
读取数值 ( 数字输入 )

使用「数字输入」的积木,读取的数值只会有 1 和 0 两种信号,预设在完全没有接传感器的状态下数值为 1 ,「程式」积木通过一个「无限循环」的积木,不断读取引脚信号。

_images/io-pin-01.jpg

可以使用「杜邦线 + 面包板 + 电阻」进行测试,并通过「上拉电阻」的方法,在程式执行后,将杜邦线连接指定引脚(如 1 )和 GND ( 接地 ),程式便会收到 0 的信号。

_images/io-pin-02.gif

读取数值 ( 模拟输入 )

使用「模拟输入」的积木,读取的数值为 0 ~ 1 之间的浮点数,程式积木通过一个「无限循环」积木,不断读取引脚信号。( 模拟输入仅支持 1 号和 2 号引脚 )

_images/io-pin-04.jpg

可以使用「光敏电阻 + 杜邦线 + 面包板 + 电阻」进行测试,下方范例并采取「下拉电阻」的方法,在程式执行后,程式便会收到 0 ~ 1 的模拟信号,光线越强数字越大,光线越弱数字越小。

_images/io-pin-05.gif

输出数值

「输出」的积木分成两种,一种是 模拟输出 ( PWM ),可以输出 0 ~ 1 之间的浮点数,另外一种是 数字输出 ,仅能输出 0 和 1 两种数值,以下方的例子而言,通过一个循环的方式调用「模拟输出」积木,不断输出 0 ~ 1 之间的浮点数作为 LED 的亮度,就能做出呼吸灯的效果。( 直接将 LED 长的一端引脚接在拓展板的 1 号引脚,短脚接在 GND )

_images/io-pin-06.jpg

_images/io-pin-07.gif

如果使用「数字输出」积木,虽然无法设计 LED 呼吸灯的效果,但仍然可以通过「无限循环」积木,设计出灯光闪烁的范例。

_images/io-pin-08.jpg

_images/io-pin-09.gif

网络功能

网络广播

网络广播功能,不仅能让与开发板彼此交换信息,更可以实现一对多、多对一、虚实互动、远距广播...等多样化的操控,通过广播功能的实现,便能将物联网的应用发挥到极致。

广播积木清单

广播积木包含一块负责发送广播消息的积木、一块负责接收广播消息的积木和一块呈现广播消息的积木。

_images/upload_66313af34ac597a959f48048083c90b8.png

发送广播消息

「发送广播消息」积木可以指定一个频道名称,以及要向这个频道发送的文字,只要频道名称相同,所有在该频道上的装置或人员,都能收到广播消息,发送广播消息不限制只有实体装置能发送,不论是实体装置、虚拟装置、没有开发板的程序...等,都能够向指定频道发送消息

「发送广播消息」积木属于「发送完成才会继续执行后面程序」的类型( 点击前方问号会提示),当编辑画面中有这块积木,执行时当程序遇到这块积木会暂停,直到发送完广播消息后才会再继续

_images/upload_3d0b521e0853faeef5db3cce155ccedb.png

接收广播消息

「接收广播消息」积木可以指定一个频道名称,就能不断收听这个频道的变化,只要有人或开发板向这个频道发送消息,就能够通过广播消息的积木显示,接收广播消息不限制只有实体装置能接收,不论是实体装置、虚拟装置、没有开发板的程序...等,都能够接收指定频道的消息

「接收广播消息」积木属于「不间断收听频道」的类型 ( 点击前方问号会提示 ),不需要放在循环内,就会不断地收听频道消息。

_images/upload_aee7d86e61092d779b2de4f4d544ce06.png

举例来说,使用者A 可以在「点击小怪兽」的同时,向频道test 发送广播消息,而使用者B 和C 负责收听test 频道,如果有收到,就让的小怪兽显示收到的广播消息。

_images/upload_0b91bc8997597950c81a08b6ff9c4da5.gif

又或者可以使用 开发板的按钮开关,按下 A 的时候向 test 频道发送文字 A,按下 B 的时候发送文字 B。

_images/upload_6d03b662089ad7597383e722fcba85a1.png

收听 test 频道的的开发板可以撰写逻辑判断,当收到 A 的时候显示红色的 A,收到 B 的时候显示蓝色的 B。

_images/upload_1787d5ea745207986a66096b047dc097.png

两块开发板的程序都执行后,点击负责发送广播的开发板的按钮开关,就可以看到另外一块开发板显示对应的消息。

_images/broadcast-07.gif

使用 MicroPython 编程

通过烧写 MicroPython 固件,就可以在开发板中使用 Python 语言进行编程。

在下述目录将提供丰富的示例代码以及专业 IDE 的支持(如:VsCode、PyCharm)。

使用 Arduino 编程

提示

Arduino 将不会阐述过多基础内容,请具备 C/C++ 的语言开发基础。

提供了入门 Arduino 的软件工具和最佳示例,降低进入 ESP32 嵌入式专业开发的门槛。

_images/footer.png

Indices and tables