Utwórz nowy mechanizm renderowania

Aby utworzyć niestandardowy mechanizm renderowania, musisz przypisać klasę Renderer. Więcej informacji o mechanizmie renderowania znajdziesz w dokumentacji pojęcia mechanizmu renderowania.

class CustomRenderer extends Blockly.blockRendering.Renderer {
  constructor() {
    super();
  }
}

Bez zmian domyślny mechanizm renderowania wygląda tak:

podstawowy mechanizm renderowania

Możesz też utworzyć podklasy dla jednego z pozostałych wbudowanych mechanizmów renderowania i zastępować jego fragmenty.

class CustomRenderer extends Blockly.thrasos.Renderer {
  constructor() {
    super();
  }
}

Podklasa innych komponentów mechanizmu renderowania

Rzeczywisty kształt bloku jest określany przez podkomponenty mechanizmu renderowania.

Domyślnie klasa Renderer udostępnia działające wersje wszystkich komponentów mechanizmu renderowania. W ten sposób możesz zmodyfikować jeden komponent i nie martwić się o pozostałe.

Jeśli na przykład chcesz zmienić kształt połączeń, możesz zastąpić constants bez konieczności klikania pozostałych komponentów.

Więcej informacji o działaniu poszczególnych komponentów znajdziesz w dokumentacji komponentu renderującego.

Zastąp metody fabryczne

Po podklasyfikowaniu komponentów mechanizmu renderowania musisz zastąpić metody fabryczne Renderer w przypadku komponentów, które są podklasy. Dzięki temu mechanizm renderowania będzie mógł prawidłowo połączyć różne komponenty.

W przypadku każdego rodzaju komponentu jest stosowana metoda:

Rejestrowanie mechanizmu renderowania

Gdy skończysz tworzenie niestandardowego mechanizmu renderowania, musisz go zarejestrować. Powoduje to powiązanie mechanizmu renderowania z ciągiem znaków, dzięki czemu możesz przekazać go do konfiguracji wstrzykiwania.

Blockly.blockRendering.register('custom_renderer', CustomRenderer);

const workspace = Blockly.inject(blocklyDiv, {
  renderer: 'custom_renderer',
});