遅くなりましたが最終回の内容をまとめます。最終回は特別回として、Arduinoに関しての補足説明をしました。ほとんどがペーパーに書いてある内容のままなので主に補足です。ペーパーの表面で色がついてある部分は変数および関数の名前です。名前なのでプログラム上の意味はなく、その名前でなければならないという事はありません。他の名前を付けても大丈夫です。用途に合わせた名前を付けましょう。同じ色で統一されている箇所の名前は同じでなければなりません。裏面では各センサーのArduinoへの接続の大雑把な説明をしています。誤った繋ぎ方をすると熱を持ったり壊れたりと危険なので各センサーの説明が記載されたレジュメも見ながら接続してください。以上でProcessingレクチャーを終了します。各自参考書を読んで映像ジャンクションに備える事をおすすめします。7回目7回目の内容をまとめます。このレクチャーは次回のArduino特別回をもって最終回とします。前回の動画では1フレームに同時に1つの図形しか描画しませんでした。複数の図形を描画する場合、位置や大きさなどを描く数の分だけ制御する必要があります。変数をx1、x2、x3...、y1、y2、y3...、と宣言してそれぞれの要素にしてもいいですが、x1やy1の「1」は変数名の一部であって、数字を変数に置き換えて使用する事は出来ません。そこで使うのが配列です。配列を使うと自動で番号を振られた複数の変数を宣言できます。変数arrayをn個配列で宣言したなら、array[0]、array[1]...、array[n-1]まで作られます。この[]内の数字なら変数を用いて制御できます。forループと組み合わせるのが簡単です。int[3];これを宣言すれば、hairetsu[0]、hairetsu[1]、hairetsu[2]の3つのint型の変数が作られます。他の型の配列を宣言したければ2つあるintをfloatやcolorなどに変更します。hairetsuは変数名、[3]は配列の要素数を指定します。数字でなくint型の変数でも指定できます。関数内などでforループを使って初期化しましょう。マウスで操作できるプログラムの説明をします。これはリアルタイムでキャンパス上のマウスカーソルの座標を自動で取得します。これを描画の各要素に使用すればマウスを動かす事で変化させる事が出来ます。新しいシステム変数を説明します。mousePressedマウスボタンが押されているかを調べるシステム変数です。何かしらマウスボタンが押されているとtrue、離しているとfalseを自動で取得します。if文の条件文として使う事で、ボタンを押す事での変化を制御できます。一般的に、マウスカーソルがどこの座標にあるかを判別するif文と合わせて使用します。mouseButtonマウスのどのボタンが押されているかを調べるシステム変数です。RIGHT、LEFT、CENTERのみ格納する事が出来、それぞれのボタンに対応します。用いたif文の中などで更にif文やswitch文を用いて使用します。pmouseX、pmouseY1フレーム前のキャンパス上のマウスカーソルの座標を自動で取得するシステム変数です。mouseX、mouseYとの差を計算する事でマウスの動く速さを計算出来ます。イベントハンドラ関数について説明します。関数内の一番最後に自動で呼び出されます。関数内で変更された座標情報の影響を受けます。mouseMoved(){}マウスボタンを離しながら動かしている時に呼び出される関数です。マウスを動かしていなければボタンを離していても呼び出されません。mouseDragged(){}マウスボタンを押しながら動かしている時に呼び出される関数です。マウスを動かしていなければボタンを押していても呼び出されません。mousePressed(){}マウスボタンを押した時に呼び出される関数です。mouseReleased(){}マウスボタンを離した時に呼び出される関数です。mouseClicked(){}マウスボタンを押してその場で動かさずに離した時に呼び出される関数です。関数も設定している時にはその関数より後に呼び出されます。マウスを操作する以外にもキーボードを用いた操作もプログラムする事が出来ます。詳しくは参考書を見て下さい。ペーパーのプログラムの補足です。その26回目の内容をまとめの続きです。今までは静止画の描画について学んでいきましたが、今回から動画について学習していきます。関数を用いて描いてきましたが、これからはその関数自体を構築するという流れになります。動画を作成するには最低でも2つの決められた関数を構築する必要があります。変数を宣言する場所にも注意が必要になります。関数内で宣言された変数は「ローカル変数」として扱われ、その関数内でしか使用できません。宣言されますが、このfor文が終了すればそれらの変数は使用できなくなります。逆に、関数外で宣言された変数は「グローバル変数」として扱われ、どこからでも使用できます。その反面プログラムが長くなると、どの関数で変更されているのか把握しづらくなります。関数は起動したときに最初の一回だけ実行され初期設定を行う関数です。変更の必要がない設定をする関数を入力します。宣言されたばかりのグローバル変数の初期化も行ってもよいでしょう。ここで変数を宣言してもローカル変数のため他の関数で扱う事は出来ません。frameRate(a);1秒間にa回フレームを更新するように設定します。基本的に30か60しか設定しません。関数が実行された後に停止するまで繰り返し実行される関数です。今までの静止画の描画はこのこの関数の1フレームを描画しているというニュアンスになります。用いたり、この関数内でグローバル変数を変化させて用いたりする事で描画を変化させる、つまりはアニメーションさせる事が出来ます。ここで変数を宣言、初期化してから変化させても繰り返される度にリセットされてしまいます。イメージとしては透明のセル画に描画して、幾重にも重ねるといった感じです。関数の最初に画面を背景色で塗りつぶす命令をします。軌跡をフェードアウトしたければ、透明度を持った背景色で画面を塗りつぶします。関数が繰り返される度に座標情報はリセットされます。座標情報を変更してアニメーションさせる場合はグローバル変数を変化させて用いるとよいでしょう。これらの関数以外にも自分で新しく関数を作り出す事も出来ます。関数を作る利点は、一連の命令を一つにまとめ名前を付ける事で使いやすくする事です。一例として以下の関数を見てみます。2つの整数を引数として渡してその和を返す関数です。s;}tashizanは関数の名前です。命名規則は変数のそれと同じです。)で引数を設定します。()の中に、変数を宣言するように型と変数名を指定します。区切る事で複数の引数を使用できます。引数を使用しない場合は()の中に何も入力しません。intの部分で戻り値の型を指定します。戻り値とは最終的に関数で導き出したい値の事です。関数の中で戻り値とする変数を宣言します。最終的にこの変数の値を関数の値として扱います。実行する事で戻り値を返します。この関数の使い方の一例を見てみます。関数では()内で宣言されたaとbにxとyの値である3と5がそれぞれ格納されます。関数内で宣言されたsにaとbの和が格納され戻り値として関数の値として返されます。関数内の変数sの値が格納される事になります。それ自体を変数として見る事も出来ます。y)」にxとyの和の値が格納されている、というイメージです。関数は大きく分けて、「戻り値の型がvoid型であるかそれ以外か」、および「引数があるかないか」の2*2の4パターンがあります。戻り値がvoid型以外の場合は、先の説明の通り変数のように扱われます。void型の場合は戻り値を返さないので、関数内の命令を実行するだけになります。Processingで描画に扱う関数はこのvoid型の関数です。引数を受け取る関数はその引数に応じて導き出される値が変わります。引数がない関数では呼び出される度に同じ値を返します。あるならその限りではありません。おなじみの引数の値に応じて命令を実行する関数です。頂点数v、半径rの正多角形を原点を中心に描きます。いった呼ばれる度に同じ命令を実行する関数です。キャンパス一杯に日の丸を描きます。いった引数の値に応じて計算された値を返す関数です。加速度accelでtime時間動いた時の距離を求める関数です。常に同じ値しか返さない関数です。使わない限り作る意義は薄いです。サイコロを振って値を得る関数です。float型で値を返すので、頭に(int)を入力してint型に変換しています。その16回目の内容をまとめます。今回は2つに分けて記載します。レクチャーでは下の画像ファイルを使用しました。80x80Processingではプログラムを入力して図形を描く以外にも画像データや音楽データ等の外部データを使用する事が出来ます。今回は画像データとフォントデータを使用します。一度名前をつけて保存し、セーブフォルダーを作成します。初期設定なら「マイドキュメント」→「Processing」の中にあると思われます。ショートカットキーで呼び出せます。そのセーブフォルダー内に「data」という名前のフォルダーを新規作成します。作成されたdata内に使用する外部データを保存します。保存するデータの名前は半角文字でも全角文字でも構いません。画像データを使い表示させます。jpg、png、gif、tgaの拡張子のファイルを扱う事が出来ます。loadImage("▼");画像を使用するためにPImage型の変数「◆」を宣言し、その変数に使用する画像ファイル「▼」を格納します。ように分けて入力する事も出来ます。b);imageModeの内容に応じて◆に格納された画像を表示します。大きさを決める4つ目と5つ目の引数は省略する事が出来ます。y)から横幅a、縦幅bの大きさの画像を表示するようにします。b)の四角形に収まる大きさの画像を表示するようにします。y)から横幅a、縦幅bの大きさの画像を表示するようにします。格納した画像ファイルにまつわるデータを扱う事が出来ます。◆.heightそれぞれ◆に格納した画像ファイルの横幅、縦幅の数値を取得します。他にも画像に色味や透明度を付加して表示できます。詳しくは参考書を見て下さい。次はフォントデータを使い文字を表示させます。フォントデータであるvlwファイルを作成する必要があります。Font...」を選択するとフォントを作成するウィンドウが現れます。任意のフォントを選択してフォントサイズを入力し、ファイル名も決めます。Characters」を選択します。作成されるvlwファイルの容量が膨大になるので注意が必要です。loadFont("▼");フォントを使用するためにPFont型の変数「◆」を宣言し、その変数に使用するフォントファイル「▼」を格納します。a);フォントサイズをaに指定した上で使用するフォントを設定します。2つ目の引数は省略する事もできます。y);textAlignの内容に応じて文字列★を表示します。y)から左詰めに文字列を表示するようにします。y)から中央揃えで文字列を表示するようにします。y)から右詰めに文字列を表示するようにします。入力する文字列には¥nを入れる事で改行する事が出来ます。その改行幅をaに指定します。未指定の場合、改行幅はフォントサイズ*2になります。textWidth("★")表示する文字列★の横幅の数値を取得します。指定したフォントにより取得する数値は異なります。5回目5回目の内容をまとめます。今回はProcessingで使える数学について学習しました。各項目を各自見て下さい。表記することができます。);とすると違う形状の渦巻ができます。値が加算ではなく乗算で大きくなるためです。2)とすると星型を描きます。この方法だと正多角形の頂点を1つ飛ばしに結んでいるだけなので図形の内側に枠線も描かれてしまいます。Vの値が偶数だと星型は描けません。コピーして確認しましょう。これだとVの値が偶数でも描けます。)/cos(PI/V)の部分が星形の内側の頂点の原点からの距離になります(図の青線部)。図の赤線部と青線部の比率がとなるためです。2回目あたりで紹介してブログ未編集だったショートカットキーについてまとめます。...」というのがそれです。メニュー内で選択してもよいですが、マウスを動かすよりもスムーズに操作できます。基本的にWindowsではCtrlキーを、MacではCommandoキーを使います。このブログではよく使うキーをWindowsでの表記で紹介します。