プログラミングブロック よくある質問


個々の項目を開く・閉じるには、三角アイコンを押してください。

プログラミングブロックの基本   

プログラミングブロックとは?

プログラミングブロックはプログラミングを学ぶためのツールです。
ブロックを画面に並べていくだけでプログラミングを行うことができます。
プログラムを実行するとプログラムの実行状態(どこを実行しているか、変数には何が入っているか、など)がわかるので自分のプログラムの動きを確認出来てプログラムの誤りにすぐに気づくことができます。

プログラムで何ができる?

基本的なできることは図形を描くことができる。というそれだけです。
他には、音を出すことができる、toio を持っている場合は toioコアキューブを動かすことができる、くらいです。

ゲームを作ったり、イメージを動かしたりできる?

すごく簡単なゲームを作ることはできるかもしれませんが、プログラミングの初歩を学ぶためのツールでありゲームを作ったりはできないと考えてください。
絵(アイコン)を表示したり、動かしたりすることもできません。



画面の操作   

描画エリアの拡大・縮小など

描画エリアとは絵を描くためのエリアで、上部中央あたりの白い四角のエリアです。
ここをタップすると描画エリア操作用のパネルが表示されます。
このパネルでは描画エリアの拡大・縮小、描画エリアのスクロール、座標軸の表示・非表示(デフォルトは非表示)が可能です。
ここでいう「描画エリアの拡大・縮小」とは描画エリアそのものを大きくしたりすることではなく表示倍率を変えるという意味です。
描画エリアそのものの大きさは現状変えることができません。

ブロックの移動

プログラミングエリアに置いたブロックを移動する方法についての説明です。
一つだけ移動するのは、ブロックをタップしそのまま(離さずに)動かします。
すでにブロックがあるところへは移動できません。また画面の外へ移動することもできません。
複数のブロックを移動する場合は、まず移動する複数のブロックを選択された状態にします。選択された状態とは濃い灰色の状態です。
複数のブロックを選択するには以下の二つの方法があります。

ブロックを移動するには選択したブロックのうちのどれか一つを指で押し、指を離さずに動かします。

ブロックのコピー

ブロックをコピーする場合は、まず対象のブロックを選択所歌にします。(選択状態にする方法は上の「ブロックの移動」を参照ください。)
次にメニューの「コピー」を選択し、その後「貼り付け」を選択します。これによりブロックが別の場所へコピーされます。
貼り付けられる場所は適当な場所なので貼り付けた後移動してください。

ブロックの削除(いらなくなったブロックを消す)

プログラミングエリア(緑の格子エリア)のいらなくなったブロックを削除するには、まずいらないブロックを選択状態にします。(選択状態にする方法は上の「ブロックの移動」を参照ください。)
そして画面右上のゴミ箱マークをタップすると削除できます。

各ブロックの動きを知りたい

各ブロックの説明は下記で参照できます

各ボタンなどの操作方法を知りたい

画面右上の「?」をタップ > 「説明モード」を選択すると説明モードになります。
説明モードでは各ボタンなどの操作説明が表示されます。操作を知りたいボタンなどをタップしてください。
説明モードでは通常の画面操作はできず説明が表示されるだけです。
説明モードを終わるには、再度「?」をタップします。

ショートカットキーは使えないですか? ctrl + C など。

ショートカットキーは原則使えません。
但し数字欄を編集中は、ctrl+C (コピー)、ctrl+V (貼り付け)が使えます。
ブロックのコピー、貼り付けはメニューから選択してください。


プログラムの実行  

プログラムの実行方法

ブロックを並べてプログラムを作った後、画面上部の右三角のボタン を押すとプログラムが実行されます。

ブロックの実行順序(基本)

プログラムを実行すると、ブロックを一つずつ順に実行します。
最初に実行するブロックは一番左に置いてあるブロックです。一番左に複数のブロックがある場合(一番左の欄にブロックが縦に並んでいる場合など)は、そのうち一番上のブロックが最初に実行されます。
次に実行されるのはその右側のブロックです。左から右方向へ順番にブロックを処理し右にブロックがなかったらそこでプログラムは終了します。
ブロックとブロックの間に隙間が空いているとそこでプログラムは終了します。隙間を飛んで離れたブロックを実行することはしません。
プログラムの実行方向にブロックがないなら終わります。これが原則の動きです。

ブロックの実行順序(実行方向を変える)

最初はブロックは左から右へ向かって順番に実行されます。
しかし矢印ブロック( )を使うと、実行方向を変えることができます。
例えば下矢印ブロック()があるとそこからプログラムの進行方向が下向きに変わり、それ以降下向きにブロックを実行していきます。
下側にブロックがなければそこでプログラムは終了です。

練習問題 下記のようなプログラムを作って実行するとどうなるでしょうか?

答え プログラムは永久に実行し続けます(実行終了ボタンを押すと止まります)。

ブロックの実行順序(条件分岐ブロック)

条件分岐ブロック は、書かれている条件が正しければ進行方向が右方向となり、条件が正しくなければ下方向になります。
この右方向と下方向 を別の方向に変えることは出来ません。

ブロックの実行順序(ループブロック)

ループブロックにはいくつかの種類がありますが、ここでは単純ループブロックについて説明します。
このブロックは指定した回数のループ処理を右方向へ実行し、指定回数のループが終わったら進行方向を下方向に変えます。
ループ処理は、右方向へブロックがなくなるまで実行し、ブロックがなくなったらループブロックまでジャンプして戻る、という処理です。

練習問題 下記のプログラムはどんな絵を描くでしょうか?

答え

バグの調査方法・プログラムがうまく動かない場合

プログラムが思った通りに動かない場合、たいていは作ったプログラムに間違いがあります。
プログラムの間違いを「バグ」と呼びます。またプログラムの間違いを見つけることや間違いを正しく修正することを「デバッグ」と呼びます。
デバッグは主に以下の4段階の手順で行います。

  1. バグをさがす
    最初は信じられないかもしれませんが、プログラムはよほど簡単なものでない限り必ずどこかに間違いがあります。
    いろいろなパターンで実行してみておかしな動きをしないか(思い通りの動きをしないところ)をチェックしてバグを見つけます。
  2. 具体的にプログラムがどう間違っているかを調べる
    バグがある(思い通りに動かない)場合はプログラムが間違っています。
    どこに間違いがあるのか(何か考え違いをしている場合や考えと違うプログラムになっている箇所)を見つけます。
  3. バグを修正します
    プログラムをどう直せばいいか考えて、プログラムを直します。
  4. 正しく修正できたか確認します
    直したプログラムを実行し、バグが修正されたか(思い通りの動きをするようになったか)を確認します。
実は1が一番重要な作業なのですが、これは実際にプログラムを動かしてみるしかありません。
次に2でプログラムのどこに間違いがあるかを調べます。プログラミングブロックにはこのための機能がいくつかあります。
これらの機能を使ってプログラムの誤り箇所を見つけます。
3,4は自分で行ってください。 ちなみに一般のプログラミング言語ではブレークポイントを設定することができますが、プログラミングブロックはブレークポイントに対応していません。


ブロックの編集  

ブロックの中身を変える方法は?(ブロックの編集方法)

ほとんのブロックは編集が可能です。
ブロック内の編集可能なエリアは以下の3つのパターンがあります。

  1. 変数選択欄
    変数(R0~R9)をプルダウン選択します。
  2. その他の選択欄
    変数以外のプルダウン選択をします。(ブロックによって選択できる内容は違います。)
  3. 数字欄
    数字をセットしておく欄です。数字欄は後述の通り変数選択に変えることが可能です。
例えば下記の条件分岐ブロックは、上の3つとも備えています。

ブロックによっては、「1 変数選択欄」のみであったり、「3 数字欄」のみだけどそれが2つある、などといった違いがあります。
ブロックの内容を変えるにはまずブロックを編集モードにします。ブロックをダブルタップするとブロックが拡大し編集モードになります。
この状態でのみブロックの内容を変更できます。
「1 変数選択欄」や「2 その他の選択欄」は欄の右にある下矢印をクリックしてリストから選択することで変更します。
「3 数字欄」はそこをタップすると、下記の数字入力用キーボードが現れます。

また数字欄の左側にボタンが表示されます。
数字欄には数字("0"~"9")及びマイナス記号("-"), 小数点(".") が入力可能で、上記の数字入力用キーボードをタップして入力します。
ボタンをタップすると、数字欄が変数選択に変わりR0~R9が選択できます。
変数を選択した場合、変数に格納されている値がその欄の値になります。
編集モードを終わるには、プログラミングエリア(緑の格子エリア)のどこか空いているところをタップします。

変数って何?

プログラミングでは変数というものを使います。変数には通常はさまざまな値(数字や文字列など)をセットすることができます。
但しプログラミングブロックでは現状セットできるのは数字のみです。(マイナスの数字や小数はセットできます。)
プログラミングブロックでは変数を標準で10個用意しています。名前はあらかじめ決まっていて R0, R1, R2, ..., R9 という名前です。
この名前を変えることはできません。 変数に値をセットするには、
(変数セットブロック)
を使います。よって変数セットブロックを下記のように変更すればR1に10をセットすることができます。(変更方法は上の「ブロックの中身を変える方法は?」をご覧ください。)

また計算ブロックを使っても変数に値をセットすることができます。
(足し算ブロック)
足し算ブロックは、ブロックの下側にある二つの数字を足してその結果をブロック右上の変数へセットするものですが、
下記のようにすると R1に10を加える(R1の値に10を足してその結果をR1にセットする)ということができます。

変数の名前は変えられる?

すみませんが変えることはできません。R0, R1 など、固定です。

もっとたくさんの変数を使いたいけどどうすればいい?配列は使える?

プログラミングブロックで扱える変数は最大20個です。(標準では10個までです。設定画面で20個に変えることができます。)
もっとたくさんの値を扱うには一般のプログラミング言語では「配列」というものを用いますが、プログラミングブロックでは現状配列を扱うことができません。


ユーザブロック  

ユーザブロックって何?

同じブロックの並びがプログラムに何回も現れるような場合、ユーザブロックを使うと便利です。
一連のブロックをまとめて一つのブロックにすることができ、これをユーザブロックと呼びます。
ユーザブロックは初心者モードでは作ることができません。通常モードに切り替えてから作ることができます。

ユーザブロックを作る方法は?

ユーザブロックは初心者モードでは作ることができません。まず通常モードに切り替えてから作ることができます。
通常モードの画面には「新規ユーザブロック」というボタンがあり、これをタップします。
その後、ユーザブロックの名前を入力するとユーザブロックの編集画面になります。
ここにブロックを並べて「ユーザブロック閉じる」を押すとその内容のブロックが作成されます。ユーザブロックは画面左側のブロックリストの一番下に表示されます。

ユーザブロックを使うメリットは? いろいろなメリットがありますが、主なものは下記と思います(1人でプログラムを作っている前提です。)
  1. プログラムが分かりやすくなる
    一般的には長いプログラムと短いプログラムでは、短いプログラムの方が理解しやすいでしょう。
    一つのまとまった処理をユーザブロックにすることで、プログラムを短くすることができます。
    勿論、プログラムが複数に分かれてしまいますが、長いプログラム1つと、短いプログラム2つなら、短いプログラム2つの方がわかりやすいと思います。
  2. 修正がしやすくなる
    一連の同じ処理が複数回プログラムに現れる場合、コピー&ペーストして繰り返していく手もあります。
    しかしこの場合、修正が必要になったときに面倒です。
    ユーザブロックにしておくと、ユーザブロックをひとつ修正するだけですみます。
  3. テストがしやすい
    プログラムを分割しておくことで、テストするパターンを少なくすることができます。
    またバグがあった場合も原因調査がしやすくなると思います。
  4. 再起処理ができる
    再起処理はユーザブロック内で自分自身を呼び出すような処理です。
    使う機会は限られますが、図形を描く場合などに非常に強力で複雑な図形を簡単なプログラムで描くことができます。

ユーザブロックで変数の値はどうなる?

ユーザブロックに入ったときは変数の値はそのままです。但しユーザブロックを終わるときは、入った時の値に戻ります。
つまりユーザブロックの中ではもとの値がそのまま使えますが、値を変えても元のメインプログラムの変数の値には反映されません。
よってユーザブロック内では、メインプログラム側を意識せずに、自由に変数の値を変えることができます。
但し、メインプログラム側へ値を返したいことがあると思います。つまりユーザブロックの中で変数の値を変えてそれをメインプログラムへ返したいことがあります。
その場合は ブロックを使います。
このブロックがユーザブロック内のどこかで実行されると指定された変数は上位にそのまま戻ります(元の値に戻りません)。

ユーザブロックへ値(引数)を渡すことはできる?

現状は引数を渡すことはできません。各変数の値はメインプログラムからの値を引き継ぎますが一般のプログラミング言語における引数とは異なります。

再起処理は可能?

可能です。
ユーザブロックの中に自分自身を置くことができます。誤った置き方をすると無限ループになることがあるので注意は必要です。

再起処理の上限回数はあるの?

再起処理のプログラムを誤って作ると無限ループになることがあります。このため再起ループの深さは500までにしています。
500回以上自分自身を呼び出し続けると「ユーザブロックの呼び出し回数が最大数を超えました」というエラーになります。
500回以上呼び出しが必要なのにこの制限にかかってしまうような場合は対応を検討しますのでご相談ください。

作ったユーザブロックを共通処理として他のプログラムでも使うことはできる?

できません。
ユーザブロックはそのプログラムの中でのみ有効です。
例えば、プログラムAの中のユーザブロックをプログラムBの中で使いたいという場合、プログラムBの中で新たなユーザブロックを作りコピー&ペーストを使ってユーザブロックをコピーすることになります。
この場合、プログラムAの中のユーザブロックを変更した場合、当然ですがプログラムBの中のユーザブロックには反映されません。


設定  

設定画面を表示するには?

設定画面は初心者モードでは表示できません。通常モードに切り替えてからメニューの「設定」を選択すると設定画面が表示されます。
設定画面で設定した内容は「言語の設定」を除きすぐ反映されます。またプログラムを終了しても設定は保存されています。
但し開いているプログラムによっては設定がすぐに反映できないことがあります。 (例えば大きなプログラムを開いている状態でプログラミングエリアのサイズを小さくしようとしたり、10個を超えた変数を使っているプログラムを開いている状態で変数の最大数を10に変えようとする、など) その場合はすぐには反映されません。但し設定内容は保存されていますので、次に新しいプログラムを作成したときに反映されます。

プログラミングエリアに並べるブロックの数が多くて横幅又は縦幅が足らない。

設定画面で、格子の横の数・縦の数を設定しプログラミングエリアを広げることができます。

ブロックが小さすぎて見づらい。ブロックが大きすぎる。

ブロックのサイズは、設定画面にて5段階(極小、小、中、大、極大)から選択できます。
ブロックリストにあるブロックの大きさとプログラミングエリアにあるブロックの大きさを別々に設定できます。

変数の数が10個では少ない。

変数の数は、設定画面で10個から20個に増やすことができます。可能な設定は10個及び20個の2パターンのみです。

画面をもっと広く使いたい。プログラミングエリアを広くしたい。

プログラミングエリアはスクロールしてみることができますが、プログラミングエリアの画面上のサイズそのものを大きくしたいという場合、
ブロックリストを普段は閉じておき必要な場合だけ広げるようにすることが可能です。
設定画面で「ブロックリストの表示方法」を「開閉可能」にすると、ブロックリストが普段は閉じていて、「ブロックリスト」と書かれた縦棒部分をタップするとブロックリストが開くようになります。

初心者モードに戻したい。

通常モードに変更した後、初心者モードに戻すには設定画面で「実行モード」の「初心者モード」を選択します。


その他  

プログラムの保存

作成したプログラムはメニューの保存でファイルに保存しておくことができます。
保存先は特定のフォルダでこの保存先を変えることはできません。
実際に保存されるファイルのファイル名は保存するときに指定する名前に ".blk" という拡張子を付加したファイル名になります。この拡張子はプログラミングブロックの画面には表示されません。

プログラムはどのフォルダに保存される?

標準では実行プラットフォーム毎に下記のとおりです。
Windows版:C:\Users\[ユーザ名]\AppData\LocalLow\jp_hasegawake\ProgrammingBlock
Android版: 内部ストレージ /Android/data/jp.hasegawake.ProgrammingBlock/files
iOS版:/var/mobile/Containers/Data/Application/[guid]/Documents (ここで [guid] とは ProgrammingBlock のIDようなものらしいですが具体的な値は知りません)
ブラウザ版: ファイルではなく、indexedDB というデータベースに保存されるらしく、よく分かりません。

作ったプログラムをほかの人に渡したい

作ったプログラムをクリップボードを経由してテキストファイルに出すことができます。
但しブラウザ版ではこれができないため、ブラウザ版ではプログラムをほかの人に渡すことはできません。(画面のハードコピーを取って、見せるくらいかな。)
以下はブラウザ版以外の場合(Windows版、Android版、iOS版 の場合)です。
メニューから「名前を付けて保存」を選ぶと保存するファイル名を入力する画面が現れますが、ここで「クリップボードへ」というボタンが選択できます。
これでクリップボードへテキスト形式でプログラムが出力できます。このテキストをメールへそのまま貼りつけるなどして他の人へ送ります。
もらった人はテキストをクリップボードへコピーし、プログラミングブロックのメニューの「開く」を選択し「クリップボードから」を選択します。
(例えばメールの本文でプログラムを受け取った場合は、メール本文を全選択しコピーした後、プログラミングブロックのメニュー「開く」→「クリップボードから」を選択します。)
「クリップボードから」のメニューが選択できない(ボタンが灰色になっている)場合はプログラムが正しくクリップボードへコピーされていない場合です。
テキストエディタなどへクリップボードから貼り付けをしてプログラムが正しくクリップボードに貼りついているか確認ください。
正しい場合、先頭が <?xml で始まっていて、最後が --> で終わっています。先頭に改行が入っていたりしてもダメです。

toio を操作したい

toio操作するための前提条件があります。toioについてをご覧ください。

Mac でプログラミングブロックは使える?

Mac(Mac OS)は対応はしていません。但し以下の方法はあります。


使い方ページへ戻る