Blocchi preimpostati

Puoi configurare (preimpostare) lo stato dei blocchi in una casella degli strumenti. Ad esempio, puoi impostare un campo su un valore predefinito o collegare due blocchi. Puoi anche creare blocchi ombra, che fungono da valori predefiniti per i blocchi secondari.

Esempi

Ecco alcuni esempi di blocchi preimpostati.

Bloccare con un valore di campo preimpostato

Ecco un blocco math_number il cui campo mostra il numero 42 anziché il valore predefinito 0:

Un blocco numerico il cui valore è preimpostato su 42.

Ecco una casella degli strumenti che imposta questo 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>

Blocchi precollegati

Ecco un blocco controls_for a cui sono collegati tre blocchi math_number:

Un blocco &quot;count with i from value to value by value&quot;. I tre input di valore sono collegati a blocchi numerici con i valori 1, 10 e 1.

Ecco una casella degli strumenti che precollega questi blocchi:

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>

Blocchi disattivati

I blocchi disattivati non possono essere trascinati dalla casella degli strumenti. I blocchi possono essere disattivati singolarmente utilizzando la proprietà facoltativa disabled.

Un menu a comparsa con tre blocchi. Il terzo blocco è disattivato e non è selezionabile.

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>

Puoi anche disattivare o attivare un blocco in modo programmatico utilizzando setDisabledReason.

Configurare i blocchi

Puoi configurare un blocco in una casella degli strumenti in qualsiasi modo tu possa configurarlo in un workspace. Ad esempio, puoi impostare i valori dei campi, collegare i blocchi agli input di valori o istruzioni, aggiungere commenti e comprimere o disattivare i blocchi. Ciò è possibile perché le toolboxes utilizzano lo stesso codice per configurare i blocchi che gli spazi di lavoro utilizzano per serializzarli.

Ciò significa anche che è facile creare una configurazione di blocco. Carica il blocco in uno spazio di lavoro, configurarlo come preferisci e serializzarlo eseguendo il seguente codice nella console.

JSON

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

XML

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

Puoi quindi copiare il codice di configurazione e incollarlo nella tua casella degli attrezzi. Assicurati di rimuovere le proprietà x, y e id, che vengono ignorate dalla casella degli strumenti.

Campi variabili

I campi variabili potrebbero dover essere specificati in modo diverso quando si trovano in una casella degli strumenti rispetto a quando vengono serializzati.

In particolare, quando i campi variabili vengono serializzati in JSON, contengono solo l'ID della variabile che rappresentano, perché il nome e il tipo della variabile vengono serializzati separatamente. Tuttavia, le toolboxes non contengono queste informazioni, quindi devono essere incluse direttamente nel campo della variabile.

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

Blocchi ombra

I blocchi ombra sono blocchi segnaposto che svolgono diverse funzioni:

  • Indicano i valori predefiniti per il blocco principale.
  • Consentono agli utenti di digitare i valori direttamente senza dover recuperare un blocco di numeri o stringhe.
  • A differenza di un blocco normale, vengono sostituiti se l'utente rilascia un blocco sopra di loro.
  • Informano l'utente del tipo di valore previsto.

Per creare un blocco ombra, utilizza la proprietà shadow (JSON) o il tag <shadow> (XML) anziché la proprietà block o il tag <block>. Ad esempio, di seguito è riportato un blocco math_arithmetic con due blocchi ombra math_number collegati a esso:

Un blocco `math_arithmetic` con due input di valori separati da un menu a discesa dell&#39;operatore in cui è selezionato l&#39;operatore più. Ogni valore inserito contiene un blocco di numeri ombreggiato, che viene visualizzato in grigio per indicare che può essere sostituito da un altro blocco.

Ecco una cassetta degli attrezzi che utilizza questi blocchi ombra:

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>