Kod Oluşturucular

Blockly'nin çoğu uygulaması, kullanıcının programının bir programlama diline çevrilmesini gerektirir. Bu işlem, Blockly tarafından istemci tarafında gerçekleştirilir.

Kod Oluşturuluyor

İlk adım, söz konusu dil için oluşturucuyu eklemektir. Blockly, aşağıdaki oluşturma araçlarını içerir:

  • JavaScript
  • Python
  • 2.999
  • Lua
  • Dart

Aşağıdaki yöntemlerden birini kullanarak oluşturucuları içe aktarabilir ve kullanabilirsiniz.

Modüller

import {javascriptGenerator} from 'blockly/javascript';
import {pythonGenerator} from 'blockly/python';
import {phpGenerator} from 'blockly/php';
import {luaGenerator} from 'blockly/lua';
import {dartGenerator} from 'blockly/dart';

const jsCode = javascriptGenerator.workspaceToCode(workspace);
const pythonCode = pythonGenerator.workspaceToCode(workspace);
const phpCode = phpGenerator.workspaceToCode(workspace);
const luaCode = luaGenerator.workspaceToCode(workspace);
const dartCode = dartGenerator.workspaceToCode(workspace);

Ağırlıktan çıkar

Blockly'yi dahil ettikten sonra oluşturma aracını eklemeniz gerekir.

<script src="https://unpkg.com/blockly"></script>
<script src="https://unpkg.com/blockly/javascript_compressed"></script>
<script src="https://unpkg.com/blockly/python_compressed"></script>
<script src="https://unpkg.com/blockly/php_compressed"></script>
<script src="https://unpkg.com/blockly/lua_compressed"></script>
<script src="https://unpkg.com/blockly/dart_compressed"></script>

const jsCode = javascript.workspaceToCode(workspace);
const pythonCode = python.workspaceToCode(workspace);
const phpCode = php.workspaceToCode(workspace);
const luaCode = luna.workspaceToCode(workspace);
const dartCode = dart.workspaceToCode(workspace);

Yerel komut dosyaları

Blockly'yi dahil ettikten sonra oluşturma aracını eklemeniz gerekir.

<script src="blockly_compressed.js"></script>
<script src="javascript_compressed.js"></script>
<script src="python_compressed.js"></script>
<script src="php_compressed.js"></script>
<script src="lua_compressed.js"></script>
<script src="dart_compressed.js"></script>

const jsCode = javascript.workspaceToCode(workspace);
const pythonCode = python.workspaceToCode(workspace);
const phpCode = php.workspaceToCode(workspace);
const luaCode = lua.workspaceToCode(workspace);
const dartCode = dart.workspaceToCode(workspace);

Gerçek Zamanlı Oluşturma

Kod oluşturmak son derece hızlı bir işlemdir. Bu nedenle, bu işlevin sık çağrılmasının bir sakıncası yoktur. En yaygın strateji, Blockly'nin değişiklik etkinliğine bir işleyici ekleyerek kodu gerçek zamanlı olarak oluşturmak ve görüntülemektir:

import {javascriptGenerator} from 'blockly/javascript';
function updateCode(event) {
  const code = javascriptGenerator.workspaceToCode(workspace);
  document.getElementById('textarea').value = code;
}
workspace.addChangeListener(updateCode);

Daha fazla bilgi için Etkinlikler'e göz atın.