javascript - 创建自定义 block 并编写代码以在 Android 上生成 Javascript 代码

Question

我想要一个名为'Movement'的不同类别的 block ，其中包含两个名为MoveForward和MoveBackward的 block 。

在 blockly 核心库的 toolbox.xml 文件中， 我添加了用于创建 UI 的 XML 代码。

<category name="Movement" colour="190">

        <block type="move_forward">
            <value name="TEXT">
                <shadow type="text">
                    <field name="TEXT">4</field>
                </shadow>
            </value>
        </block>

        <block type="move_backward">
            <value name="TEXT">
                <shadow type="text">
                    <field name="TEXT">4</field>
                </shadow>
            </value>
        </block>

</category>

现在我需要在哪里添加 JavaScript 代码，以便在使用和运行这些 block 时创建输出 JavaScript 代码？ 简单来说，我需要做哪些额外的事情才能使这些 block 生成 JavaScript 代码？

Answer 1

我假设您已经编写了 block 定义，并且这些 block 显示在工具箱 UI 中。在这种情况下，代码生成器就是您所缺少的部分。在所有 blockly 平台上用 JavaScript 定义的生成器。它们看起来像这样:

// From the Android turtle demo.
// https://github.com/google/blockly-android/blob/master/blocklydemo/src/main/assets/turtle/generators.js
Blockly.JavaScript['turtle_move_internal'] = function(block) {
  // Generate JavaScript for moving forward or backwards.
  var value = block.getFieldValue('VALUE');
  return 'Turtle.' + block.getFieldValue('DIR') +
      '(' + value + ', \'block_id_' + block.id + '\');\n';
};

Blockly.JavaScript 是 block 类型名称(在您的情况下为 move_forward 和 move_backward)到 JavaScript 生成器函数的映射。每个生成器函数都在 JavaScript Block 中传递。目的。这与 Blockly 网络版中随处使用的 API 相同。

编写您自己的生成器文件。如果您使用的是 Android，则该文件应位于您的 Assets 文件夹中，以及 AbstractBlocklyActivity.getGeneratorsJsPaths() 返回的 Assets 路径之一。