工作区创建

Blockly 工作区是 Blockly 的最高级别组件。界面就是 使用区块编程的方法。

有关工作区及其子组件的详细信息，请参见可视化 术语库。

Injection div

Blockly 工作区必须注入到 <div> 中，称为“注入” div”。

注入 div 可静态调整大小， 动态。div 中的 Blockly 元素会更新其自身的 调整窗口大小时的大小。

以下代码段展示了静态大小的注入 div 的 HTML：

<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>

注射

注入会创建组成 工作区。它还会执行获取工作区所需的所有初始化 可供使用。

注入函数可以接受注入 div 的 ID，也可以接受注入 div 本身：

// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });

// Passes the injection div.
const workspace = Blockly.inject(
    document.getElementById('blocklyDiv'), { /* config */ });

配置

可为工作区配置多个选项（例如布局和样式） 注射期间。

如需详细了解配置选项，请参阅 配置选项。