Blockly プログラミング解説

この文書では、ブラウザー上で動作する開発環境「RasPythonカーIDE」Blocklyモードの操作に関する説明を記載しています。

ブロックを配置する

RasPythonカーIDEの「Blockly モード」プログラミングページを開くと、下記のようなブロックエディタ画面が表示されます。

ブロックエディタ

左側にある灰色の領域は、ブロックが分類ごとに準備されている「引き出し」となっています。まずは分類の中から1つをクリックして開き、引き出しの中からブロックを1つ選びます。白いキャンバスの上にドラッグ＆ドロップすると、ブロックを配置できます。

ブロックが置かれると、エディタ右側にある「Pythonコード変換エリア」の内容が変化します。ブロックの状態を変更するたびに、Pythonコードは常に対応するように変化していきます。
「Pythonコード変換エリア」には直接コードを記述することはできません。

ブロックを配置するキャンバスは、ブラウザのウインドウとは独立してスクロールすることができます。また、右下の「＋」「－」ボタンで表示の拡大縮小ができます。

要らないブロックを持ってきてしまったときは、右下のゴミ箱アイコンへドロップするか、灰色の引き出し領域にドロップすることで片づけることができます。

ブロックの種類

ブロックは、大まかに「命令ブロック」と「出力ブロック」の2つに分けることができます。

命令ブロック
上下に連結部が付いているブロックです。
命令ブロック同士は、縦に連結することができます。すべてのプログラムは命令ブロックを上から順番に実行していきます。
命令ブロックを複数つなげることで、プログラムを構築していきます。また、命令ブロックを接続してまとめたものを、ループや関数といった構造に組み上げる場合もあります。

出力ブロック
左方向に連結部が付いているブロックです。
出力ブロックは、他のブロックの「右方向の切り欠き」あるいは「ちょうど収まる形の穴が開いている場所」に接続することができます。
出力ブロックは、これらの接続先のブロックへ値を渡す (出力する) 機能を持っています。

ブロック同士の接続に関するルールは、上記の2種類の項目だけです。特別な指定がない限りは、形状の切り欠きが合うブロックは見た目通り接続が可能です。

命令・出力いずれのブロックにも、他の出力ブロックを内部または右側に入力として接続することができるものがあります。それらは別の入力データが必要となることを示しています。適切な位置に出力ブロックを接続することで、動作を指定します。内部と右側は単なる表現上の違いです。
下図は、「内部」および「右側」に出力ブロックを接続する例です。

出力ブロックの接続例 1

出力ブロックの接続例 2

また、条件分岐実行・ループ・関数などの構文を扱うブロックは、大きなCの字形をしており、内側の接続部へ命令ブロック (複数連結されたものも可) を接続することで、プログラムの組立てを行います。
下図は、構文用ブロックの内部に命令ブロックを接続する例です。

命令ブロックの接続例

お使いのブラウザーから音声を再生できる場合、ブロックを上手く接続した時に「カチッ」という音が再生されます。

プログラムを組み立てる

プログラムを組み立てる上で守るべきルールは、「必ずすべてのブロックを連結させること」です。後の「関数の使い方」節で解説しますが、「関数定義」ブロックの例外を除いて、孤立したブロックがあったり、全体が複数のパートに分かれていることは許されません。Pythonを最終ターゲットとするプログラムをブロックで表現するには、メインプログラムが複数に分離し、最初に実行するポイントが曖昧になっている状態が許容されないためです。

ループ構造の使い方

プログラム中のある特定の処理を複数回繰り返したい、または永久に反復したいといった状況は、ループ構造を活用することで実現できます。

ループをつくるためのブロックは【ループ】引き出しの中にあります。上から3種類の「大きなCの字形」のブロックで、内側の部分にある下向きの接続部に対して、命令ブロック (複数連結されたものも可) を接続して使います。

上のブロックから順に説明します。

回数指定の繰り返し。
入力した回数だけ、内部に接続した命令を上から順に実行します。命令を下まで実行すると、回数が残っている限りまた上に戻って繰り返します。
条件指定の繰り返し。
反復を続けるための条件、もしくは反復をやめるための条件を真偽値を返す条件式として入力し、各回の開始時にその条件を判定しながら、内部に接続した命令を上から順に実行します。
変数をカウントしながら繰り返し。変数をひとつ作成し、その変数を指定した数値の範囲で変更しながら内部に接続した命令を上から順に実行します。
例：
- 変数：i、範囲：1～10、間隔：1
  変数 i の値は、繰り返す度に 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 の順で変化します。
- 変数：i、範囲：1～10、間隔：2
  変数 i の値は、繰り返す度に 1, 3, 5, 7, 9 の順で変化します。
- 変数：i、範囲：5～0、間隔：1.5
  変数 i の値は、繰り返す度に 5.0, 3.5, 2.0, 0.5 の順で変化します。
注意：間隔に0は指定できません。範囲や間隔に小数を指定すると、変数は実数として処理されます。

【ループ】引き出しの4番目のブロックは、ループ内のみで使用可能な特殊な命令ブロックです。必ず、3種いずれかのループブロック内に配置する必要があります。他の命令ブロックとの接続はできますが、ループブロックの中に含めない場合は下図の示すような注意表示となり、有効化されません。

ループの使い方

機能は次の2通りから選択します。

ループから抜け出す
現在実行途中のループから強制的に抜け出します。すなわち、今回ループ内の以後の命令と、後に残っているカウント数ぶんのすべての処理が実行されずにスキップされます。
ループの最初から続ける
現在実行途中のループのうち今回カウントを打ち切り、次のカウントのループを最初から実行します。すなわち、今回ループ内の以後の命令だけがスキップされます。

関数の使い方

「関数」は、中に接続した命令列の一式に名前を与えて定義することのできる仕組みです。関数のブロックは中に命令ブロック群を接続することができますが、それ自身は命令ブロックのように上下に命令をつなげることはできません。その代わり、定義した関数を呼び出すための命令ブロックが引き出しの中に作成されるので、それを使ってプログラムの一部を効率よく使いまわすことができます。
こういった機能は、プログラミング全般では「サブルーチン」とも呼ばれることがあります。

関数の実際の使い方について、下記の画像をもとに説明を行います。

Step 1. 関数の定義

関数の使い方Step1 関数の定義

まずは関数の定義を行います。関数定義は、メインで実行するブロックとは接続点をもたないので、キャンバス内のメイン実行部とは独立した状態で新しい塊として作ります。つまり、関数を1個定義すると、キャンバス全体のブロックはメイン実行部と関数定義の2つのパートに分かれます。同様に関数2個の場合は、3パートになります。Blockly上では、これらの塊どうしの位置関係は問いません。キャンバス上にどのように配置しても問題はありません。

以下の手順を参考に、関数の定義を行ってください。

【関数】引き出しから、C の字形をした「新しい関数を定義するブロック」をキャンバスに配置します。戻り値をもたない関数は、引き出し内一番上のブロック、戻り値をもつ関数は、上から2番目のブロックを使います。
次に、関数ブロック上部の設定項目を編集します。
- 「関数名」欄に、この関数の名前を入力します。初期値は new_function となっていますが、関数の機能が類推できるように、わかりやすい名前に変更することをお勧めします。
- 関数に引数をつける場合は、歯車マークのボタンをクリックして現れた吹き出しの中で必要数だけ引数ブロックをサンプルへ接続します。それぞれの引数には、名前をつけてください。
- ？マークのボタンをクリックすると、関数の説明文を記載することができます。(省略可) ここで記載した内容はプログラムの動作には影響を与えませんが、関数の機能や動作を説明する内容のメモを付けておくと、後の管理がしやすくなります。また、この内容は右側のPython記述にも反映されます。
関数ブロック内部の下向き接続部に対して命令ブロックを連結し、関数の処理内容プログラムを組み立てます。
- 【関数】引き出しにある「もしも..戻り値..」ブロックを使用すると、処理の途中で条件分岐して関数を中断することができます。このブロックは、関数ブロックの中でのみ配置可能です。一般の命令ブロックと同様、すべての命令ブロックと互いに接続することができますが、関数外に配置した場合は使用できず、有効化されません (上記画像内に示す警告表示になります)。
  戻り値をもつ関数の場合は、中断した際に返す戻り値を接続してください。
(戻り値をもつ関数のみ)
関数ブロック右下端に対して、戻り値を出力するブロックを接続します。

Step 2. 関数の実行

関数の使い方Step2 関数の実行

関数の定義が終わると、それを実行 (呼び出し) するための新しいブロックが【関数】引き出しに追加されます。

【関数】引き出しから、Step1-1. で付けた関数名のブロックを取り出し、メイン実行部の実行を行いたい箇所に追加します。
- 戻り値なしの関数は、命令ブロックとして配置可能です。
- 戻り値ありの関数は、出力ブロックとして配置可能です。適当な変数に代入することで、関数を実行しつつその戻り値が代入先の変数に入ります。

サンプルプログラム

Pythonモード用のプログラミングカリキュラムでは、車両ベース制御に関する一連の基礎動作を行うためのサンプルプログラムが9項目用意されています。これらのサンプルのうち、宣言部の書き出しのみである CODE1 を除いた CODE2～CODE9 について、Python記述と同等の動作を行うBlocklyモード用のプログラムを準備しています。ファイル名は practice_code02.xml～practice_code09.xml です。

Blocklyモードでのプログラミングは扱える文法やデータ構造がPythonと比較してシンプルであるため、Pythonの記述と比較して冗長となっている箇所があります。逆に言えば、Pythonでの記述ではBlocklyモードよりもスマートに同等の処理を行うプログラムの組み立てが可能となります。大規模なプログラムを作成する際は、Pythonモードでのプログラミングにも挑戦してみてください。