Un espace de travail Blockly est le composant de niveau le plus élevé de Blockly. C'est l'UI qui que vous utilisez pour programmer avec des blocs.
Pour en savoir plus sur l'espace de travail et ses sous-composants, consultez les glossaire.
Divulgation d'injection
Un espace de travail Blockly doit être injecté dans un <div>, appelé le mécanisme d'injection
div".
Le div d'injection peut être dimensionné de manière statique ou de manière dynamique. Les éléments blockly de l'élément div mettent à jour leur lorsque la fenêtre est redimensionnée.
L'extrait de code suivant montre le code HTML d'un div d'injection de taille statique:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Injection
L'injection crée tous les sous-éléments HTML qui composent l'interface utilisateur d'une dans l'espace de travail. Il effectue aussi toutes les opérations d'initialisation nécessaires pour que l'espace de travail prêts à l'emploi.
La fonction d'injection peut utiliser l'ID du div d'injection ou l'ID d'injection div lui-même:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Configuration
L'espace de travail peut être configuré avec de nombreuses options (telles que la mise en page et le style). lors de l'injection.
Pour en savoir plus sur les options de configuration, consultez Options de configuration.