預設設定方塊

您可以設定 (預設) 工具箱中積木的狀態。舉例來說,您可以將欄位設為預設值,或將兩個方塊連在一起。您也可以建立陰影方塊,做為子項方塊的預設值。

範例

以下列舉幾個預設區塊的範例。

使用預設欄位值封鎖

以下是 math_number 區塊,欄位顯示數字 42,而非預設的 0:

值預設為 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>

預先連結的積木

以下是連有三個 math_number 區塊的 controls_for 區塊:

「count with i from value to value by value」(以 i 從值到值,以值為單位計數) 區塊。這三個值輸入內容會連結至值為 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 屬性,個別停用區塊。

含有三個方塊的飛出式選單。第三個區塊已停用,並顯示為灰色。

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"
        }
      }
    }
  ]
}

陰影方塊

陰影方塊是預留位置方塊,可執行多項功能:

  • 這些值表示父項區塊的預設值。
  • 使用者可以直接輸入值,不必擷取數字或字串方塊。
  • 與一般方塊不同,如果使用者在這些方塊上放置方塊,這些方塊就會遭到取代。
  • 並告知使用者預期的值類型。

如要建立陰影方塊,請使用 shadow 屬性 (JSON) 或 <shadow> 標記 (XML),而非 block 屬性或 <block> 標記。舉例來說,以下 math_arithmetic 區塊有兩個 math_number 陰影區塊與其相連:

`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>