プリセット ブロック

ツールボックス内のブロックの状態を構成(プリセット)できます。たとえば、フィールドをデフォルト値に設定したり、2 つのブロックを接続したりできます。また、子ブロックのデフォルトとして機能するシャドー ブロックを作成することもできます。

プリセット ブロックの例をいくつか示します。

プリセットのフィールド値でブロックする

次の例は、フィールドにデフォルトの 0 ではなく 42 が表示される math_number ブロックです。

値が 42 にプリセットされている数値ブロック。

このフィールドを設定するツールボックスは次のとおりです。

JSON

{
 "kind": "flyoutToolbox",
 "contents": [
   {
     "kind": "block",
     "type": "math_number",
     "fields": {
       "NUM": 42
     }
   },
 ]
}

XML

<xml id="toolbox" style="display: none">
 <block type="math_number">
   <field name="NUM">42</field>
 </block>
</xml>

事前接続されたブロック

次に、3 つの math_number ブロックが接続された controls_for ブロックを示します。

「count with i from value to value by value」ブロック。3 つの値入力は、値が 1、10、1 の数値ブロックに接続されています。

これらのブロックを事前接続するツールボックスは次のとおりです。

JSON

{
 "kind": "flyoutToolbox",
 "contents": [
   {
     "kind": "block",
     "type": "controls_for",
     "inputs": {
       "FROM": {
         "block": {
           "type": "math_number",
           "fields": {
             "NUM": 1
           }
         }
       },
       "TO": {
         "block": {
           "type": "math_number",
           "fields": {
             "NUM": 10
           }
         }
       },
       "BY": {
         "block": {
           "type": "math_number",
           "fields": {
             "NUM": 1
           }
         }
       },
     }
   },
 ]
}

XML

<xml id="toolbox" style="display: none">
 <block type="controls_for">
   <value name="FROM">
     <block type="math_number">
       <field name="NUM">1</field>
     </block>
   </value>
   <value name="TO">
     <block type="math_number">
       <field name="NUM">10</field>
     </block>
   </value>
   <value name="BY">
     <block type="math_number">
       <field name="NUM">1</field>
     </block>
   </value>
 </block>
</xml>

無効なブロック

無効なブロックはツールボックスからドラッグできません。ブロックは、オプションの disabled プロパティを使用して個別に無効にできます。

3 つのブロックを含むフライアウト メニュー。3 つ目のブロックは無効になっており、グレー表示になっています。

JSON

{
 "kind": "flyoutToolbox",
 "contents": [
   {
     "kind": "block",
     "type":"math_number"
   },
   {
     "kind": "block",
     "type": "math_arithmetic"
   },
   {
     "kind": "block",
     "type": "math_single",
     "disabled": "true"
   }
 ]
}

XML

<xml id="toolbox" style="display: none">
 <block type="math_number"></block>
 <block type="math_arithmetic"></block>
 <block type="math_single" disabled="true"></block>
</xml>

setDisabledReason を使用して、ブロックをプログラムで無効または有効にすることもできます。

ブロックを構成する

ワークスペースで構成できる方法であれば、ツールボックス内のブロックを任意の方法で構成できます。たとえば、フィールド値を設定したり、ブロックを値またはステートメントの入力に接続したり、コメントを追加したり、ブロックを折りたたんだり無効にしたりできます。これは、ツールボックスがワークスペースがブロックのシリアル化に使用するのと同じコードを使用してブロックを構成するためです。

ブロック構成を簡単に作成できることも意味します。ブロックをワークスペースに読み込み、必要な構成を行い、コンソールで次のコードを実行してシリアル化します。

JSON

console.log(Blockly.serialization.workspaces.save(Blockly.getMainWorkspace()));

XML

console.log(Blockly.Xml.workspaceToDom(Blockly.getMainWorkspace()));

構成コードをコピーして、ツールボックスに貼り付けることができます。ツールボックスで無視される xyid プロパティを必ず削除してください。

変数フィールド

変数フィールドは、ツールボックスにある場合とシリアル化されている場合で、指定方法が異なることがあります。

特に、変数フィールドが通常 JSON にシリアル化される場合、変数名と型は個別にシリアル化されるため、変数フィールドにはそれが表す変数の ID のみが含まれます。ただし、ツールボックスにはその情報が含まれていないため、変数フィールドに直接含める必要があります。

{
  "kind": "flyoutToolbox",
  "content": [
    {
      "kind": "block",
      "type": "controls_for",
      "fields": {
        "VAR": {
          "name": "index",
          "type": "Number"
        }
      }
    }
  ]
}

シャドウ ブロック

シャドー ブロックは、次のようないくつかの機能を実行するプレースホルダ ブロックです。

  • これらは、親ブロックのデフォルト値を示します。
  • ユーザーは、数値ブロックや文字列ブロックを取得しなくても、値を直接入力できます。
  • 通常のブロックとは異なり、ユーザーがブロックを重ねてドロップすると置き換えられます。
  • ユーザーに想定される値のタイプを通知します。

シャドー ブロックを作成するには、block プロパティまたは <block> タグの代わりに、shadow プロパティ(JSON)または <shadow> タグ(XML)を使用します。たとえば、2 つの math_number シャドー ブロックが接続された math_arithmetic ブロックを次に示します。

演算子プルダウンでプラス演算子が選択された、2 つの値入力が演算子で区切られた `math_arithmetic` ブロック。各値入力にはシャドー数値ブロックが含まれています。このブロックは、別のブロックで置き換えることができることを示すためにグレー表示されています。

これらのシャドー ブロックを使用するツールボックスは次のとおりです。

JSON

{
 "kind": "flyoutToolbox",
 "contents": [
   {
     "kind": "block",
     "type": "math_arithmetic",
     "fields": {
       "OP": "ADD"
     },
     "inputs": {
       "A": {
         "shadow": {
           "type": "math_number",
           "fields": {
             "NUM": 1
           }
         }
       },
       "B": {
         "shadow": {
           "type": "math_number",
           "fields": {
             "NUM": 1
           }
         }
       }
     }
   },
 ]
}

XML

<xml id="toolbox" style="display: none">
 <block type="math_arithmetic">
   <field name="OP">ADD</field>
   <value name="A">
     <shadow type="math_number">
       <field name="NUM">1</field>
     </shadow>
   </value>
   <value name="B">
     <shadow type="math_number">
       <field name="NUM">1</field>
     </shadow>
   </value>
 </block>
</xml>