カスタム ブロック

このドキュメントは、Blockly 内で新しいブロックを作成するデベロッパーを対象としています。ユーザーが編集可能な Blockly のローカルコピーを持っており、通常は Blockly の使用方法に精通しており、JavaScript の基本的な知識があることを前提としています。

Blockly には事前定義されたブロックが多数用意されています。数学関数からループ構造まで、あらゆるものが揃っています。ただし、外部アプリケーションと連携するには、カスタム ブロックを作成して API を形成する必要があります。たとえば描画プログラムを作成する場合、「半径 R の円を描画する」ブロックの作成が必要になることがあります。

ほとんどの場合、最も簡単な方法は、すでに存在する非常によく似たブロックを見つけてコピーし、必要に応じて変更することです。次のドキュメントは、さらにサポートが必要な場合を対象としています。

ブロックを定義する

まず、ブロックを作成し、その形状、フィールド、接続ポイントを指定します。Blockly Developer Tools を使用すれば、このコードを記述するのが最も簡単な方法です。

Blockly Developer Tools の詳細

API について学習した後、このコードを手動で記述することもできます。

ブロックの定義の詳細...

高度なブロックは、ユーザーやその他の要因に応じて動的に形状が変化する場合があります。

Mutators の詳細...

コード生成

次に、ブロックコード生成ツールを作成し、新しいブロックをプログラミング言語(JavaScript、Python、PHP、Lua、Dart など)にエクスポートします。

ブロックコード ジェネレータの詳細

新しいブロックを使う

ブロックを作成したら、ツールボックスに追加するか、ワークスペースで使用することを忘れないでください。

カスタム ブロックの追加に関する詳細