呈现器

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

内置渲染器

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

渲染程序 说明 图片
瑟拉索 推荐的渲染程序。该渲染程序对 geras 渲染程序采用更现代的方式,拥有更均匀的间距和实线边框。 特拉索
Geras 默认渲染程序。它是构建 Blockly 时使用的原始渲染程序。 格拉斯
泽洛斯 一款基于 Scratch-3.0 块设计的渲染程序。 Zelos

如需使用下列某个渲染程序,请将名称传递到注入选项:

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

自定义渲染程序

如果您希望程序的外观和风格不同于任何内置渲染程序,还可以创建自定义渲染程序。如需开始使用,Blockly 团队建议您:

  1. 仔细阅读渲染程序概念文档,了解渲染程序的所有组件如何组合在一起。
  2. 完成自定义渲染程序 Codelab,亲身体验自定义渲染。
  3. 调试渲染程序添加到项目中。
  4. 自定义渲染程序。