封鎖說明

您可以透過工具提示和說明網址提供區塊說明。

工具提示

當使用者將滑鼠游標懸停在區塊上時，工具提示會提供即時協助。如果文字過長，系統會自動換行。

JSON

{
  // ...,
  "tooltip": "Tooltip text."
}

JavaScript

init: function() {
  this.setTooltip("Tooltip text.");
}

在 JavaScript API 中，工具提示也可以定義為函式，而非靜態字串。這可提供動態說明。請參閱 math_arithmetic，瞭解如何根據所選的下拉式選單選項變更工具提示。

JavaScript

Blockly.Blocks['math_arithmetic'] = {
  init: function() {
    // ...

    // Assign 'this' to a variable for use in the tooltip closure below.
    var thisBlock = this;
    this.setTooltip(function() {
      var mode = thisBlock.getFieldValue('OP');
      var TOOLTIPS = {
        'ADD': Blockly.Msg['MATH_ARITHMETIC_TOOLTIP_ADD'],
        'MINUS': Blockly.Msg['MATH_ARITHMETIC_TOOLTIP_MINUS'],
        'MULTIPLY': Blockly.Msg['MATH_ARITHMETIC_TOOLTIP_MULTIPLY'],
        'DIVIDE': Blockly.Msg['MATH_ARITHMETIC_TOOLTIP_DIVIDE'],
        'POWER': Blockly.Msg['MATH_ARITHMETIC_TOOLTIP_POWER']
      };
      return TOOLTIPS[mode];
    });
  }
};

使用 JavaScript API 時，區塊可以指定函式，而非傳回工具提示字串的靜態字串。這可讓您使用動態工具提示。如需範例，請參閱 math_arithmetic。

自訂

您也可以提供自訂轉譯函式，自訂工具提示的外觀。建立可接受兩個參數的函式：

• 首先，您要轉譯內容的 <div> 元素
• 第二個是實際的元素，也就是您要顯示工具提示的元素

在函式主體中，您可以將所需內容算繪至 div。如要取得在滑鼠游標所在區塊上定義的工具提示字串，您可以呼叫 Blockly.Tooltip.getTooltipOfObject(element);，其中 element 是上述第二個參數。

最後，請註冊這個函式，以便 Blockly 在適當時間呼叫這個函式：

Blockly.Tooltip.setCustomTooltip(yourFnHere);

如需範例，請參閱自訂工具提示示範。

說明網址

區塊可與相關聯的說明頁面建立關聯。使用者只要在區塊上按一下滑鼠右鍵，然後從內容選單中選取「說明」，即可使用這項功能。如果這個值為 null，則不會顯示「說明」項目。

JSON

{
  // ...,
  "helpUrl": "https://en.wikipedia.org/wiki/For_loop"
}

JavaScript

init: function() {
  // ...
  this.setHelpUrl('https://en.wikipedia.org/wiki/For_loop');
}

使用 JavaScript API 時，區塊可以指定函式，而非傳回網址字串的靜態字串，因此可提供動態說明。