Utwórz obszar roboczy

Obszar roboczy Blockly to komponent najwyższego poziomu w Blockly. Jest to interfejs, w którym programujesz za pomocą bloków.

Więcej informacji o przestrzeni roboczej i jej podzespołach znajdziesz w słowniku wizualnym.

Blok wstrzykiwania

Obszar roboczy Blockly musi być wstrzyknięty do elementu <div>, zwanego „injection div”.

Wstawienie div może mieć rozmiar statyczny lub dynamiczny. Elementy Blockly w div zmieniają rozmiar, gdy zmieniasz rozmiar okna.

Poniższy fragment kodu pokazuje kod HTML wstawienia o statycznym rozmiarze:div

<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>

Zastrzyk

Wstrzykiwanie tworzy wszystkie elementy podrzędne HTML, które składają się na interfejs obszaru roboczego. Przeprowadza też całą inicjację potrzebną do przygotowania obszaru roboczego do użycia.

Funkcja wstawiania może przyjmować identyfikator wstawienia div lub samo wstawienie div:

// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });

// Passes the injection div.
const workspace = Blockly.inject(
    document.getElementById('blocklyDiv'), { /* config */ });

Konfiguracja

Podczas wstawiania obszar roboczy można skonfigurować za pomocą wielu opcji (takich jak układ i styl).

Więcej informacji o opcjach konfiguracji znajdziesz w artykule Opcje konfiguracji.