旧版 Blockly 开发者工具

Blockly 开发者工具 是一款基于网络的开发者工具,可自动完成 Blockly 配置的部分操作, 包括创建自定义组成要素、构建工具箱 以及如何配置 Web Blockly 工作区。

Blockly 开发者使用该工具的流程包括三个部分:

  • 使用 Block Factory 和 Block Exporter 创建自定义块。
  • 使用 Workspace Factory 构建工具箱和默认工作区。
  • 使用 Workspace Factory(目前仅支持 Web 应用)配置您的工作区 功能)。

屏蔽出厂标签页

“Block Factory”标签页可帮助您 屏蔽定义区块码生成器 。在此标签页上,您可以轻松创建、修改和保存 自定义组成要素

定义块

本视频详细介绍了定义区块的步骤。界面出问题了 但其突出显示的屏蔽功能仍是准确的。

管理库

块是按其名称引用的,因此您要创建的每个块都必须 唯一名称。界面会强制执行该指令,并在您“保存”时明确指出这一点 新块或“更新”现有块

您可以在之前保存的组成要素之间切换,也可以创建新的空白要素 请点击“库”按钮更改现有块的名称 另一种快速创建多个具有相似定义的砌块的方法。

导出和导入库

块会保存到浏览器的本地存储空间。清除浏览器的本地数据 会删除您的数据块要无限期保存组成要素,您必须 下载您的媒体库。您的 Block Library 会以 XML 格式下载 该文件可以导入,以便将 Block Library 设置为 您下载了该文件。请注意,导入 Block Library 会替换 因此您可能需要先导出

导入和导出功能也是维护和 共享不同的自定义屏蔽设置。

“屏蔽“导出程序”标签页

设计分块后,您需要导出分块定义 和生成器存根,以便在应用中使用它们。此操作在 屏蔽“导出程序”标签页。

块库中存储的每个块都将显示在块选择器中。 点击相应块即可将其选中或取消选中以导出。如果您想选择 点击“Select”(选择)→“All Stored In Block”(所有存储块) 媒体库”选项。如果您使用 “Workspace Factory”标签页,也可以选择之前使用过的 依次点击“选择”→“Workspace Factory 中的全部使用”。

通过导出设置,您可以选择要定位到的生成语言 以及是否需要定义和/或生成器存根 选定的屏蔽设置选择后,点击“导出”下载您的 文件。

Workspace 的“工厂”标签页

通过 Workspace Factory,可以轻松配置工具箱和默认 一组数据块您可以在编辑工具箱和 启动带有“工具箱”的工作区和“Workspace”按钮。

构建工具箱

此标签页有助于为 Toolbox 构建 XML。材料假定 熟悉工具箱的功能。 如果您想要在此处修改工具箱的 XML,则可以 点击“加载到编辑”即可加载

不含类别的工具箱

如果您有几个区块,但希望将它们全部显示,而不显示任何类别,只需 将它们拖到工作区中,您就会在工具箱中看到这些砌块 。

包含类别的工具箱

如果您希望按类别显示屏蔽设置,请点击“+”按钮,然后选择 新类别的下拉菜单项。这样即可向您的类别列表添加类别 您可以选择并进行修改选择“标准类别”以添加单个 标准 Blockly 类别(逻辑、循环等),或“Standard Toolbox”将所有 标准 Blockly 类别。使用箭头按钮可对类别进行重新排序。

要更改所选类别的名称或颜色,请使用“修改类别” 下拉菜单。将砌块拖到工作区中,即可将其添加到选定工作区 类别。

高级组成要素

默认情况下,您可以在库中添加标准组成要素或任意要素 工具箱中。如果您的库中没有以 JSON 格式定义的块, 可以使用“导入自定义组成要素”工具按钮。

有些代码块应一起使用或包含默认值。您可以通过 群组和阴影。不限 编辑器中连接的块将作为一个组添加到工具箱中。 连接到其他块的块也可以更改为阴影块。 方法是选择子块,然后点击“Make Shadow”按钮。 注意:只有不包含变量的子块才能更改为阴影 。

如果您在工具箱中添加变量或函数块,请包含 工具箱中的“变量”或“函数”类别 利用该代码块。详细了解 “变量”或“函数”类别

配置工作区(适用于 Web Blockly)

如需配置工作区的不同部分,请前往“Workspace Factory” 然后选择“工作区”

选择工作区选项

配置选项 然后在预览区域查看结果正在启用 gridzoom 可显示更多选项。 此外,切换为使用类别通常需要更复杂的 workspace;垃圾桶和滚动条会在您添加 第一类。

将预加载的区块添加到工作区

这是可选操作,但如果您希望在 工作区:

  • 当应用加载时。
  • 当事件(进入下一关、点击帮助按钮等)被触发时。

将砌块拖到编辑空间中,即可通过预览在工作区中查看它们。 您可以创建区块组、停用区块,以及将某些区块设为影子 屏蔽规则

您可以将这些块导出为 XML 文件(见下文)。使用以下命令将它们添加到您的工作区: Blockly.Xml.domToWorkspace,在您创建工作区后立即执行以下操作:

var xmlText = '<xml xmlns="https://developers.google.com/blockly/xml">' +
    '<block type="math_number"></block></xml>';
Blockly.Xml.domToWorkspace(Blockly.utils.xml.textToDom(xmlText), workspace);

此示例代码会向工作区添加一个 math_number 代码块。

正在导出

Workspace Factory 提供以下导出选项:

  • 起始代码:生成起始 HTML 和 JavaScript 以注入您的自定义 Blockly 工作区。
  • Toolbox:生成用于指定工具箱的 XML。
  • Workspace Blocks:生成可加载到工作区中的 XML。