早稲田大学 基幹理工学部 表現工学科長研究室 B4 鈴木 遼

16 July 2013

今日やること

Processing とプログラミングの基礎

今日は 10 項目

1. スケッチを保存する

プログラムを保存する

場所は Windows だとドキュメント/Processing

画像を扱う準備

画像ファイル（.png, .jpg, .gif, .tga）を用

意する

画像の名前を覚えやすいものに変える

例) picture.png

画像ファイルは 1. のスケッチと同じフォ

ルダに保存

画像を扱う準備

2. 画像

PImage 型の変数は画像を保持することが

できる

PImage picture; void setup() { size(600,400); } void draw() { }

3. 画像データを読み込む [1/2]

loadImage(filename) は指定されたファイ

ル名の画像を読み込む

PImage picture; void setup() { size(600,400); picture = loadImage(“picture.png”); } void draw() { }

3. 画像データを読み込む [2/2]

draw ブロックで毎フレーム画像を読み込む

と動作が重くなるので避ける

void setup() { size(600,400); } void draw() { PImage picture = loadImage(“picture.png”); }

4. 画像データを表示する [1/2]

image(p,x,y) は PImage 型のデータ p を座

標 x, y の位置に表示する

PImage picture; void setup() { size(600,400); picture = loadImage(“picture.png”); } void draw() { image(picture,30,50); }

4. 画像データを表示する [2/2]

問題) 画像がマウスカーソルについてくるよ

うなプログラムをつくる

PImage picture; void setup() { size(600,400); picture = loadImage(“picture.png”); } void draw() { background(255,255,255); image(picture,mouseX,mouseY); }

5. フレームの保存 [1/2]

save(filename) は現在のウィンドウを画

像ファイルとして保存する

draw ブロックの中で毎回 save をすると動

作が重くなるので注意

save(filename);

5. フレームの保存 [2/2]

void setup() { size(600,400); fill(0,0,255); } void draw() { background(255,255,255); ellipse(frameCount,200,80,80); if(frameCount==100) { save(“mypicture.png”); } }

6. 複数の選択肢 [1/2]

else if で追加の条件を指定できる

if(条件A) { // 条件 A が true } else if(条件B) { // それ以外で 条件 B が true } else { // どちらの条件にも当てはまらない }

6. 複数の選択肢 [2/2]

void setup() { size(600,400); float value = random(0,3); println(value); if(value<1.0) { background(255,0,0); } else if(value<2.0) { background(0,255,0); } else { background(0,0,255); } }

void draw() { }

7. 文字リテラル

シングルクオーテーション ‘ で囲まれた文

字は文字リテラルと呼ばれる文字データ

文字列リテラルと違って 1 文字

println(‘a’); println(‘B’); println(‘?’);

8. char 型

文字リテラルは char (チャー) 型

char a = ‘a’; char b = ‘B’; println(a); println(b);

9. キーボード入力 [1/2]

keyPressed はキーボードのキーが押され

ていたら true, 押されていなかったら

false になる boolean 型の変数

void setup() { size(600,400); } void draw() { println(keyPressed); }

9. キーボード入力 [2/2]

void setup() { size(600,400); } void draw() { background(0,0,0); if(keyPressed) { ellipse(300,200,200,200); } }

10. キーの文字 [1/2]

key は最後に押されたキーの文字が保存さ

れた, char 型の変数

void setup() { size(600,400); } void draw() { println(key); }

10. キーの文字 [2/2]

void setup() { size(600,400); } void draw() { if(keyPressed) { if(key==‘r’) { background(255,0,0); } else if(key==‘g’) { background(0,255,0); } else if(key==‘b’) { background(0,0,255); } } }

Complete!

100%

スケッチの保存 PImage loadImage() image() save()

if – else if - else 文字リテラル char 型 keyPressed key

基礎編はここで終わり

続きは夏休みの集中講座で！

Questions?

@Reputeless