[suxing_insert_post ids=163]

Blockly Developer Tools是一个基于Web的开发者工具，它可以通过配置自动化的完成 Blockly 组件开发，包括创建自定义模块、建立工具箱、并配置 Web Blockly工作区。

使用工具的 Glockly 开发过程分为三部分：

使用Block Factory 和 Block Exporter创建自定义块

使用Workspace Factory构建工具箱和默认工作区

使用Workspace Factory配置工作区(目前只有Web功能)

1. Block Factory标签

Block Factory标签用于在自定义块时的块定义和代码生成。你可以通过这个标签简单的创建、修改、和保存块。

1.1 定义块

以下是 Blockly 官方的推出的，详细介绍定义块步骤视频的。其UI可能有些过时，但其对块定义的描述仍然是准确的。

1.2 库管理

所定义的块通过其名字进行引用，这就要求在创建块时名称必须唯一。Blockly UI会强制检查，在“保存”或“更新”时，如果名称不唯一会进行提示：

点击Block Library按钮，可以在之前保存的“块”之间进行切换或创建新块。修改现有块是一种快速创建块的方法，这样可以快速创建多个相似的块。

1.3 导入、导出库

块会被保存在浏览器本地存储中，如果清除了浏览器本地存储，那么块也会被删除。要将块持久化保存，就需要将库导出。你的Block Library可以做为一个XML文件被下载，而下载的文件又可以导入，以将Block Library设置为下载时的状态。但需要注意，导入时当前Block Library会被XML文件替换。

导入和导出特性是维护和共享不同自定义块的推荐方法。

2. Block Exporter标签

块设计好后，就需要导出块定义和生成器以在应用中使用它们。这些操作可以在Block Exporter标签完成。

每个保存在Block Library中的块都可以在Block Selector中显示出来。在“块”上点击可以从导出项中选择或取消，如果全部导出可以“Select”->“All Stored In Block Library”。

构建或配置工作区，可以使用Workspace Factory标签，也可以选择要使用的块后再“Select”->“All Used In Workspace Factory”。

在“导出设置”中你可以选择要导出的语言以及是否需要选定块的定义等。确认选择后，点击“Export”即可下载文件。

3. Workspace Factory标签

Workspace Factory标签可以帮助你配置工具箱和设置工作区中的默认块。Workspace Factory标签下有Toolbox和Workspace两个按钮：

3.1 构建工具箱

Toolbox可以为工具箱构建XML，如果你有一个编辑的工具箱的XML，那么可以通过单击“Load to Edi”来加载它。

3.2 无类别的工具箱

如果你有一些块要显示，但不想添加分类。你可以简单的将其拖到工作区，然后就可以在工作区中看到了。

3.3 有类别的工具箱

在如下所示的工作区中，如果你将“块”分类显示，那么可以点击“+”号并选择下拉列表项。其中，“New 将添加一个类别到您的类别列表中，你可以选择和编辑；而“Standard Category”会添加一个标准的 Blockly 分类(如：Logic、Loops等)；“Standard Toolbox”会添加所有 Blockly 标准分类到工具箱。通过“上下箭头”可以对分类进行排序。

要修改已选择块的名称和颜色，可以使用“Edit Category”下拉选项。

3.4 高级块

默认你可以添加任何标准块或你库中的块到工具箱。如果你有在JSON文件中而非库中的块，这时可以通过“Import Custom Blocks”按钮将其导入。

有些块需要一起用或被包含到其它块中，任何在编辑器中的相关链的块都会做为一个分组被添加到工具箱中。选择子块并单击“Make Shadow”按钮，附加到另一个块的块也可以更改为阴影块。

3.5 配置工作区(Web Blockly)

要配置工作区的不同部分，则选择“Workspace Factory”再选择“Workspace”

“选择工作区”选项

在配置选项中添加不同的值时，可以预览(Preview)区域中看到结果。启用网格(Grid)或缩放(Zoom)可以显示更多配置选项；除此之外，还可以设置是否显示垃圾桶(Trashcan)和滚动条(Scrollbars)等。

工作区添加预加载块

这是一个可选项，但如果你想显示一组工作区中的块是必要的：

当应用加载时

当事件触发时

将块拖拽到编辑区，就可以在工作区预览。选择块后就可以创建块分组、禁用块、使块做为阴影块。

3.6 导出

Workspace Factory提供了以下导出选项：

Starter Code：生成启动HTML和JavaScript注入到你所定制的工作区

Toolbox：生成你的工具箱的XML

Workspace Blocks：生成一个可以加载到工作区的XML