翻譯

Blockly 中的預設訊息 (例如內容功能表中的文字) 已翻譯成多種語言。系統預設會載入 en 語言代碼,但也可以加入其他可用的語言代碼。

使用 npm 設定語言代碼

使用 import * as Blockly from 'blockly'; 匯入 Blockly 時,將取得預設模組:Blockly Core、Blockly 內建模塊、JavaScript 產生器和英文 lang 檔案。

如要使用其他語言代碼,請更謹慎地定義匯入內容:

匯入 Blockly 預設模組

import * as Blockly from 'blockly/core';
import 'blockly/blocks';
import 'blockly/javascript'; // Or the generator of your choice

匯入 Blockly 語言

舉例來說,如要匯入法文訊息集:

import * as Fr from 'blockly/msg/fr';

如要查看支援的 Blockly 語言版本完整清單,請參閱:https://github.com/google/blockly/tree/master/msg/js

設定語言代碼

匯入所需的訊息集合後,請在 Blockly 中設定語言代碼。這項功能目前僅包含在 Blockly 的 npm 版本中。

Blockly.setLocale(Fr);

這個方法必須在載入工作區前呼叫。

設定不含 npm 的語言代碼

從 Blockly msg 目錄中加入適當的 script src,系統就會自動加入翻譯內容。

<script src="../../blockly_compressed.js"></script>
<script src="../../blocks_compressed.js"></script>
<script src="../../msg/js/ar.js"></script>

自訂翻譯

Blockly 包含所有預設字串的翻譯,但如果您有含文字的自訂區塊,可能會想為這些字串加入自己的翻譯。例如,blockly/msg/es 的結構與以下類似:

Blockly.Msg["COLOUR_RGB_RED"] = "rojo";

您可以呼叫 setLocale 並傳入含有自訂翻譯的物件,藉此在 Blockly.Msg 物件上新增自訂訊息,做為新的屬性。建議您在翻譯前面加上自訂前置字串,以避免日後新增的預設翻譯發生衝突。

// In custom_es.js
export const CustomEs = {
  HELLO: "Hola",
}

// In your setup code
import * as Es from blockly/msg/Es;
import { CustomEs } from ../custom_es;
Blockly.setLocale(Es);
Blockly.setLocale(CustomEs);

setLocale 會將輸入物件的每個鍵放入 Blockly.Msg。您可以使用不同的鍵多次呼叫此方法,但如果使用重複的鍵第二次呼叫,系統會覆寫第一次呼叫的內容。

如要在區塊中參照已翻譯的字串,請使用 Blockly.Msg['HELLO'],其中應包含已設定的語言代碼字串。