Blocos predefinidos

É possível configurar (predefinir) o estado dos blocos em uma caixa de ferramentas. Por exemplo, você pode definir um campo como um valor padrão ou conectar dois blocos. Também é possível criar blocos de sombra, que servem como padrões para blocos filhos.

Exemplos

Confira alguns exemplos de blocos predefinidos.

Bloco com um valor de campo predefinido

Confira um bloco math_number cujo campo mostra o número 42 em vez do padrão 0:

E aqui está uma caixa de ferramentas que define esse campo:

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>

Blocos pré-conectados

Confira um bloco controls_for que tem três blocos math_number conectados a ele:

E aqui está uma caixa de ferramentas que pré-conecta esses blocos:

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>

Blocos desativados

Os blocos desativados não podem ser arrastados da caixa de ferramentas. Os blocos podem ser desativados individualmente usando a propriedade disabled opcional.

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>

Também é possível desativar ou ativar um bloco de maneira programática usando setDisabledReason.

Configurar blocos

É possível configurar um bloco em uma caixa de ferramentas da mesma forma que em um espaço de trabalho. Por exemplo, você pode definir valores de campo, conectar blocos a entradas de valor ou instrução, adicionar comentários e recolher ou desativar blocos. Isso é possível porque as caixas de ferramentas usam o mesmo código para configurar blocos que os espaços de trabalho usam para serializá-los.

Isso também significa que é fácil criar uma configuração de bloco. Basta carregar o bloco em um espaço de trabalho, configurá-lo da maneira desejada e serializá-lo executando o seguinte código no console.

JSON

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

XML

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

Em seguida, copie o código de configuração e cole-o na caixa de ferramentas. Remova as propriedades x, y e id, que são ignoradas pela caixa de ferramentas.

Campos de variáveis

Os campos de variáveis podem precisar ser especificados de maneira diferente quando estão em uma caixa de ferramentas em comparação com quando são serializados.

Em particular, quando os campos de variáveis são normalmente serializados para JSON, eles contêm apenas o ID da variável que representam, porque o nome e o tipo da variável são serializados separadamente. No entanto, as caixas de ferramentas não contêm essas informações. Portanto, elas precisam ser incluídas diretamente no campo de variáveis.

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

Blocos de sombra

Os blocos de sombra são blocos de marcador de posição que executam várias funções:

• Eles indicam os valores padrão do bloco pai.
• Eles permitem que os usuários digitem valores diretamente sem precisar buscar um bloco de número ou string.
• Ao contrário de um bloco normal, eles são substituídos se o usuário soltar um bloco sobre eles.
• Eles informam ao usuário o tipo de valor esperado.

Observação: os blocos de sombra não podem incluir um campo de variável ou ter filhos que também não sejam sombras.

Para criar um bloco de sombra, use a propriedade shadow (JSON) ou a tag <shadow> (XML) em vez da propriedade block ou da tag <block>. Por exemplo, confira um bloco math_arithmetic que tem dois blocos de sombra math_number conectados a ele:

E aqui está uma caixa de ferramentas que usa esses blocos de sombra:

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>