渲染程序

块的形状由渲染程序根据块的定义(即其字段和连接)确定。

内置渲染程序

Blockly 提供了三个内置渲染程序,每个渲染程序都会为程序带来略有不同的感觉。

渲染程序 说明 肖像
Thrasos 推荐的渲染程序。它是对 Geras 渲染程序的现代化演绎,具有更均匀的间距和实心边框。 thrasos
Geras 默认渲染程序。这是构建 Blockly 时所用的原始渲染程序。 geras
Zelos 基于 Scratch-3.0 块设计的渲染程序。 zelos

如需使用其中一种渲染程序,请将名称传递到配置选项中:

Blockly.inject('blocklyDiv', {
  renderer: 'thrasos'
});

自定义渲染器

如果您想让程序呈现与任何内置渲染程序不同的外观和风格,还可以创建自定义渲染程序。为了帮助您轻松上手,Blockly 团队建议您:

  1. 请阅读渲染程序概念文档,了解渲染程序的所有组件如何协同工作。
  2. 完成自定义渲染程序 Codelab,以便亲自实践自定义渲染。
  3. 调试渲染程序添加到您的项目中。
  4. 自定义渲染器。