授業資料/07 の変更点

追加された行はこの色です。
削除された行はこの色です。
授業資料/07 へ行く。
授業資料/07 の差分を削除
#contents

//  第 7 回 (Processing, 菊池先生資料終了)

* Processing (6) [#y1b5c689]

** プログラミング「文法」続き [#mf52cbb7]

二次元配列について学ぶ続き．
&br;&br;
CENTER:&size(24){''配列は「添字で操作する」''};
&br;&br;

多次元配列はとにかく見た目が悪く，添字が分かりにくくなる．
しかしそこが肝なのだ．パッと見で諦めないようにしよう．

&br;&br;
&ref(/materials/notes.png); 以下の菊池教授の web に従い，実習を行おう．

: [[&ref(/materials/JNorth_arrow-right-sm.png); Processing入門12:http://www.cp.cmc.osaka-u.ac.jp/~kikuchi/kougi/simulation2009/processing12.html]] |
実際に二次元配列を用いて，動かしてみよう．「添字で操作する」感覚に慣れよう．
&br;
レポート提出時に必要になるので，アニメーションをムービーファイルで記録しておこう．

&br;&br;
* Processing に音を [#o4551731]
* Processing に音を [#jdc72178]

** 音楽を流してみる [#h523679d]
** 音楽を流してみる [#o957b956]
Processing は効果音や音楽のような「音」も扱える．
ここでは「音楽」を流してみよう．

そのためにやることは以下の二つだ．

+ 音楽ファイルを用意する．
&br;
自分の好きな曲の mp3 ファイルか，wav ファイルを用意しよう(mp3 の方が小さくて良いね)．
そして，Processing の sketch ファイルと同じディレクトリにそのファイルを置こう．
&br;
&ref(/materials/Gnome-Preferences.png); 例えば，6月10日の「最初のスケッチファイルならば」sketch_jun10a.pde というファイルのはずだ．
&br;
&br;
+ Processing プログラムに必要なことを書き込む

例えば，音楽のファイル名が ''sample.mp3'' だとしよう．
すると次のように ''&color(red){4箇所書き換えるだけで};'' プログラム実行時にその曲が再生される．

// programu source 表記
#highlighter(language=java,number=on,cache=on){{
import ddf.minim.*;   // 音楽再生(1) 準備
Minim minim;          // 音楽再生(1) 準備
AudioPlayer player;   // 音楽再生(1) 準備

void setup()
{
  minim = new Minim(this); // 曲読み込み準備 (2)
  player = minim.loadFile("sample.mp3", 2048); // 曲読み込み(2)

  player.loop(); // 曲再生(3)
}
 
void draw()
{
}
 
void stop()
{
  player.close();  // 曲再生 後片付け(4)
  minim.stop();    // 曲再生 後片付け(4)
  super.stop();    // 曲再生 後片付け(4)
}
}}

&br;
&ref(/materials/warning.png); ''void stop()'' という知らない命令があるが，気にしないでそのまま使って良い．
&br;
&ref(/materials/warning.png); 曲ファイル名以外は 4箇所をそのままコピペして動作するので，よくわからなくても問題ない．

&br;&br;
&ref(/materials/notes.png); 実習: 上のプログラムを自分の用意した曲に対して動かしてみよう．
&br;&br;
&ref(/materials/warning.png); 周囲に迷惑をかけないよう，ボリュームを絞るか，イヤフォンなどを使おう．
&br;&br;
&ref(/materials/warning.png); 今の Processing ではまだ，音楽付きアニメーションをそのまま''「簡単に音楽付きムービーに」''することができない．
皆の知っている方法だとおそらく「音がない」か「ひどく音がずれた」ムービーが出来るだろう．
レポートにはそのムービーを提出すればよいので安心して良い．

&br;&br;
&ref(/materials/notes.png); 実習: 上を参考にして，これまでの自分の作ったアニメーションプログラムのどれか一つを選び(簡単なものが良いよ)，実行時に自分の用意した曲が再生されるように改良してみよう．

&br;&br;
** ボリュームをアニメーションに反映させてみる． [#jaff7dac]
** ボリュームをアニメーションに反映させてみる． [#f67e1695]

''上の例の「準備」に1行足すだけで''，再生している曲の音量をプログラムの中で使うことが出来る．
論より証拠，次の例を見るとよくわかるだろう．

// programu source 表記
#highlighter(language=java,number=on,cache=on){{
import ddf.minim.*;   // 音楽再生(1) 準備
import ddf.minim.signals.*;  // 音楽再生(1) 準備: 追加分
Minim minim;          // 音楽再生(1) 準備
AudioPlayer player;   // 音楽再生(1) 準備


float leftlevel, rightlevel; // あとで使う…

void setup()
{
  size(200, 200);
  fill(0,255,0);
 
  minim = new Minim(this); // 曲読み込み準備 (2)
  player = minim.loadFile("sample.mp3", 2048); // 曲読み込み(2)

  player.loop(); // 曲再生(3)
}
 
void draw()
{
  background(0);

  leftlevel  = player.left.level()*1000;   // 左側音量を取得！
  rightlevel = player.right.level()*1000;  // 右側音量を取得！

  rect(0, height-leftlevel, width/2, leftlevel); 
  rect(width/2, height-rightlevel, width/2, rightlevel);
  // なんか四角を描いているぞ？
}
 
void stop()
{
  player.close();  // 曲再生 後片付け(4)
  minim.stop();    // 曲再生 後片付け(4)
  super.stop();    // 曲再生 後片付け(4)
}
}}

&br;&br;
&ref(/materials/notes.png); 実習: 上のプログラムを自分の用意した曲に対して動かしてみよう．

&br;&br;
&ref(/materials/notes.png); 実習: 上のプログラムを参考に，音量を反映するようなアニメーションを作ろう．

&br;&br;
&ref(/materials/Gnome-Preferences.png); 余裕のある学生向け: [[&ref(/materials/JNorth_arrow-right-sm.png); Processingおまけ>Processingおまけ]] を見ると，さらにキー入力やテキスト表示を使った簡単なサンプルが…


&br;&br;
* これまでの総復習とレポート作成 [#sb0a81d1]

これまでの学習において理解が曖昧な部分があったりしないか，復習しておこう．
&br;
また，出せていないレポートがあるならばいまのうちに作成，提出しておこう．


&br;&br;
* レポート [#qdd4b50a]

以下の課題について，あたうかぎり賢明な調査と考察と実行をし，

&size(18){''ExpMath1-Report-07''};

という題名をつけて e-mail にて教官にレポートとして提出せよ．なお，各自の

+ 所属(学部，学科)
+ 学籍番号
+ 学年
+ 氏名

を書くのを忘れないように.

&ref(/materials/warning.png); 自分のレポート作成ツールセットを記載せよ(もちろん，今回のレポートもそのツールセットを使って作成すること)．


** レポート課題 [#id379cfb]

+ 実習で出てきた練習問題と上の練習問題に対しての，自分の解答プログラムと，その結果の図形(アニメーションの場合はムービーファイルを添付で)を示せ．
+ それぞれのプログラムを「''詳細に''」解説せよ．

* about Icons, ClipArts [#s4e7f9c1]

For details, see [[&ref(/materials/JNorth_arrow-right-sm.png); this>materials]].

// ━┃┏┓┛┗┣┳┫┻╋


// コマンドライン入力は「行頭を > で始める」.
// コマンドライン出力は「行頭をブランクで始める」.

// 実習アイコン
// &ref(/materials/notes.png);

// 注意アイコン
// &ref(/materials/warning.png);

// Link アイコン
// &ref(/materials/JNorth_arrow-right-sm.png);

// OK アイコン
// &ref(/materials/OK.png);

// NG アイコン
// &ref(/materials/NG.png);

// サンプルアイコン
// &ref(/materials/Gnome-Preferences.png);

// 大文字での強調
// CENTER:&size(24){''ほげほげ''};

// 太文字 + 赤 での強調
// &color(red){''''};

// programu source 表記
// #highlighter(language=ruby,number=on,cache=on){{}}