创建自定义块 - 生成代码


title: 创建自定义块 - 生成代码

Create Custom BlocksGenerating Code

原文链接:https://developers.google.com/blockly/guides/create-custom-blocks/generating-code

大多数Blockly应用程序需要将块转换为代码以供执行。本页介绍如何向自定义块添加代码生成器。

首先,转到generators /目录并选择与要生成的语言(JavaScript,Python,PHP,Lua,Dart等)对应的子目录。假设您的块不适合现有类别,请创建一个新的JavaScript文件。这个新的JavaScript文件需要包含在编辑器的HTML文件中的<script ...>标签列表中。

典型的块的代码生成器如下所示

Blockly.JavaScript['text_indexOf'] = function(block) {
  // Search the text for a substring.
  var operator = block.getFieldValue('END') == 'FIRST' ? 'indexOf' : 'lastIndexOf';
  var subString = Blockly.JavaScript.valueToCode(block, 'FIND',
      Blockly.JavaScript.ORDER_NONE) || '\'\'';
  var text = Blockly.JavaScript.valueToCode(block, 'VALUE',
      Blockly.JavaScript.ORDER_MEMBER) || '\'\'';
  var code = text + '.' + operator + '(' + subString + ')';
  return [code, Blockly.JavaScript.ORDER_MEMBER];
};

收集参数


任何块的代码生成器的第一个任务是收集所有的参数和字段数据。这个任务通常有几个函数:

getFieldValue

block.getFieldValue('END')

此函数从指定名称的字段返回值。

  • 在文本字段的情况下,此函数返回键入的文本。例如。 “Hello World”。
  • 在下拉列表的情况下,此函数返回与所选选项相关联的与语言无关的文本。英语块可能有一个下拉菜单,选择了“first”,而德语中的下拉菜单将显示“erste”。代码生成器不必知道所有可能的人类语言,因此getFieldValue函数将返回创建下拉列表时指定的语言中性文本(Blockly的核心块通常使用大写英语单词,例如“FIRST”)。
  • 在变量下拉的情况下,此函数返回变量下拉的面向用户的名称。请注意,此名称不一定与生成的代码中使用的变量名称相同。例如,变量名“for”在Blockly中是合法的,但是在大多数语言中将与保留字冲突,因此将被重命名为“for2”。同样,阿拉伯语变量名“متغير”在Blockly中是合法的,但在大多数语言中是非法的,因此将被重命名为“_D9_85_D8_AA_D8_BA_D9_8A_D8_B1”。要获取Blockly变量名称为可用于生成代码的变量名称,请使用以下调用:
Blockly.JavaScript.variableDB_.getName(block.getFieldValue('VAR'), Blockly.Variables.NAME_TYPE);

请注意,JavaScript应该更改为适当的语言(Python,PHP,Lua,Dart等),因为每种语言都有不同的保留字列表。

valueToCode

Blockly.JavaScript.valueToCode(block, 'FROM', Blockly.JavaScript.ORDER_ADDITION) || '0'

此函数查找连接到命名值输入(“FROM”)的块,生成该块的代码,并将该代码作为字符串返回。如果输入未连接,则此函数返回null,这就是为什么通常使用布尔值“或”和默认值跟随函数的原因。因此,在上面的示例中,如果没有块附加到名为“FROM”的输入,则此输入的默认代码将为字符串'0'。

第三个参数指定嵌入所需的操作信息的顺序。每个语言生成器都有一个有序的优先级列表。 valueToCode函数需要传递对应于将应用于返回的代码的最大力的顺序值。这允许valueToCode根据需要将代码括在括号中。有关详细信息,请参阅运营商优先级页面operator precedence

请注意,JavaScript应该更改为适当的语言(Python,PHP,Lua,Dart等)。

statementToCode

Blockly.JavaScript.statementToCode(block, 'DO')

此函数查找连接到指定语句输入的嵌套块的堆栈,生成该堆栈的代码,缩进代码,并将代码作为字符串返回。如果输入未连接,则此函数返回一个空字符串。
请注意,JavaScript应该更改为适当的语言(Python,PHP,Lua,Dart等)。

组装代码


一旦收集了所有参数,就可以组合最终的代码。这对于大多数块是直接的。这里是一个while循环的例子

var code = 'while (' + argument0 + ') {\n' + branch0 + '}\n';

语句块(不返回值的那些块)然后可以返回代码,而不用费心:

return code;

值块(返回值的那些块)有点复杂。这里是一个基本算术运算符(加号,减号等)的例子:

var code = argument0 + ' ' + operator + ' ' + argument1;

此示例说明了操作顺序问题。考虑形成表达式(2 *(3 + 4))的两个连接的算术块的情况。使用上述代码剪切,加法块将返回字符串“3 + 4”,而乘法块将使用其作为输入以返回“2 * 3 + 4”。这个结果是不正确的,因为执行时3将更紧密地绑定到乘法。

为了解决这个问题,值块必须返回一个包含两个值的列表:代码和适当的顺序值:

return [code, Blockly.JavaScript.ORDER_ADDITION];

每个语言生成器都有一个有序的优先级列表。返回的顺序值指定将代码绑定在一起的最小强制。有关详细信息,请参阅运营商优先级页面operator precedence

如果生成的代码要求子块的代码被包括两次,则应该缓存参数cache the arguments以提高效率并防止副作用。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 9,689评论 0 13
  • title: 创建自定义块 - 定义块 Create Custom Blocks - Define Blocks ...
    mimimomo阅读 11,109评论 0 2
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,403评论 19 139
  • 把第三方程序打包在assembly里, 运行时释放并调用, 两种方法 使用resx文件 创建一个resx文件,如M...
    Raven7阅读 1,924评论 0 0
  • Docker是基于镜像的。镜像类似于已经包含了文件、配置和安装好的程序的虚拟机镜像。同样的,你可以像启动虚拟机一样...
    wangliang938阅读 3,021评论 0 0