Die Form eines Blocks wird von einem Renderer basierend auf der Definition des Blocks (d. h. seinen Feldern und Verbindungen) bestimmt.
Integrierte Renderer
Blockly bietet drei integrierte Renderer, die dem Programm jeweils ein etwas anderes Aussehen verleihen.
Renderer | Beschreibung | Bild |
---|---|---|
Thrasos | Der empfohlene Renderer. Es ist eine modernere Version des Geras-Renderers mit gleichmäßigeren Abständen und durchgezogenen Rahmen. | ![]() |
Geras | Der Standard-Renderer. Es ist der ursprüngliche Renderer, mit dem Blockly entwickelt wurde. | ![]() |
Zelos | Ein Renderer, der auf dem Blockdesign von Scratch 3.0 basiert. | ![]() |
Wenn Sie einen dieser Renderer verwenden möchten, übergeben Sie den Namen an die Konfigurationsoptionen:
Blockly.inject('blocklyDiv', {
renderer: 'thrasos'
});
Benutzerdefinierte Renderer
Wenn Sie Ihrem Programm ein anderes Erscheinungsbild als die integrierten Renderer geben möchten, können Sie auch einen benutzerdefinierten Renderer erstellen. Das Blockly-Team empfiehlt Ihnen für den Einstieg Folgendes:
- Lesen Sie die Konzeptdokumentation zu Renderern, um zu erfahren, wie alle Komponenten eines Renderers zusammenarbeiten.
- Absolvieren Sie das Codelab für benutzerdefinierte Renderer, um praktische Erfahrungen mit dem benutzerdefinierten Rendering zu sammeln.
- Fügen Sie Ihrem Projekt den Debug-Renderer hinzu.
- Renderer anpassen