积木开发系列----自定义Block的过程

最新推荐文章于 2025-09-30 05:26:11 发布

原创

最新推荐文章于 2025-09-30 05:26:11 发布 · 943 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

基本过程

Blockly中提供了很多预先定义好的小积木，但当你涉及具体的领域的时候，这些预定义好的积木可能不能满足你的需求，这样，就需要定义自己独特的小积木来满足需求了。这一节，将会添加一个计算字符串长度的小积木来演示整个过程。
自定义Block的流程包括以下三个步骤：
1、定义积木：Blockly是可以通过外观来判断Block作用以及行为，这里就定义Block外观的步骤。
2、添加到工具箱中：定义好了以后需要添加到工具箱中以便后续引用。
3、为这个积木编写一段翻译代码，这段代码用于把BLOCK翻译成为响应的高级语言，比如JavaScript

定义Block

先上代码：

Blockly.Blocks['string_length'] = {
   
   
  init: function() {
   
   
    this.appendValueInput("VALUE")//添加一个输入参数
        .setCheck("String")//检查输入参数，必须是字符串的输入
        .setAlign(Blockly.