Processing によるプログラミング入門の第 4 回目。研究室の勉強会で発表しました。 PowerPoint のファイルが欲しい場合は連絡をください。 [←前回] 第 3 回 http://www.slideshare.net/Reputeless/processing-3-23489861 [次回→] 第 5 回 http://www.slideshare.net/Reputeless/processing-5

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

2. 今日やること
 Processing とプログラミングの基礎
 簡単なことを 13 項目だけ覚えます

3. 1. boolean 型
 true と false は boolean 型の値
 boolean 型の有効な値は true か false のみ
 boolean 型の値は if の条件に直接使える
boolean a = true, b = false;
println(a + " " + b);
if(a)
{
println("AAA");
}
if(b)
{
println("BBB");
}
true false
AAA

4. 2. グローバル変数
 setup/draw ブロックの外で作られた変数
 それ以降のどこでも使うことができ、値は
保存される
int global = 100;
void draw()
{
int local = 100;
++global;
++local;
println(global + " " + local);
}
101 101
102 101
103 101
104 101
105 101
106 101
107 101
…
▲ 変数 local は毎回
新しく作り直される

5. 3. 配列
 同じ型のデータを複数連続して集め、同じ
名前で操作できるようにしたもの
 型名[] 名前 = new 型名[サイズ] で作成
int[] iArray = new int[100];
double[] dArray = new double[50];
▲ 100 個の要素を持つ int 型の配列
▲ 50 個の要素を持つ double 型の配列

6. 4. 配列の要素へのアクセス
 配列の要素は添え字 [index] を使って読み書
きできる。1 つ目の要素の index は 0, 2 つ
目の要素の index は 1 となる。したがって
サイズ N の配列における最大 index は N-1
int[] a = new int[3];
a[0] = 100;
a[1] = 200;
a[2] = 300;
println(a[0]+ " " +a[1]+ " " + a[2]);
100 200 300

7. 5. 配列の範囲外アクセス
 配列の index が間違った範囲にある場合、
エラーになる
int[] a = new int[3];
a[0] = 100;
a[1] = 200;
a[10] = 300; // Error!
println(a[0]+ " " +a[1]+ " " + a[2]);

8. 6. 配列の初期値
 波括弧 {} を使うと、要素の初期値を指定し
て配列を作ることができる
 new で作った int または double 型の配列の
要素の初期値は 0
int[] a = { 100, 200, 300 };
println(a[0]+ " " +a[1]+ " " + a[2]);
100 200 300

9. 7. 配列のサイズ
 .length を使うと配列のサイズを取得でき
る
int[] a = new int[150];
double[] b = { 1.2, 3.4, 5.6, 7.8 };
println(a.length);
println(b.length);
150
4

10. 8. 配列とループ
 for 文のループカウンタを index として使う
ことで、配列の操作を簡潔に記述できる
int[] a = new int[8];
for(int i=0; i<a.length; ++i)
{
a[i] = i*100;
}
for(int i=0; i<a.length; ++i)
{
println(a[i]);
}
0
100
200
300
400
500
600
700

11. 9. width と height [1/2]
 width と height はディスプレイウィンド
ウの幅と高さを表す変数
size(600,400);
println(width + "x" + height);
600x400

12. 9. width と height [2/2]
size(600,400);
rect(0,0,width/2,height/2);

13. 10. マウス座標 [1/2]
 mouseX と mouseY はマウスカーソルの
位置を表す変数
void setup()
{
size(600,400);
}
void draw()
{
println(mouseX + " " + mouseY);
}

14. 10. マウス座標 [2/2]
void setup()
{
size(600,400);
noStroke();
}
void draw()
{
ellipse(mouseX,mouseY,10,10);
}

15. 11. マウスボタン [1/2]
 mousePressed はマウスのボタンが押さ
れていたら true, 押されていなかったら
false になる boolean 型の変数
void setup()
{
size(600,400);
}
void draw()
{
println(mousePressed);
}

16. 11. マウスボタン [2/2]
void setup()
{
size(600,400);
noStroke();
}
void draw()
{
if(mousePressed)
{
ellipse(mouseX,mouseY,10,10);
}
}

17. 12. テキスト [1/2]
 テキストを描く
 str 表示するテキスト
 x, y 描き始める位置の座標（左下）
text(str, x, y);

18. 12. テキスト [2/2]
void setup()
{
size(600,400);
}
void draw()
{
background(0,0,0);
text("One",0,100);
text("Two",50,200);
text(3,100,300);
}

19. 13. テキストのサイズ [1/2]
 テキストのサイズを変更する
 size テキストのサイズ
textSize(size);

20. 13. テキストのサイズ [2/2]
void setup()
{
size(600,400);
textSize(60);
}
void draw()
{
background(0,0,0);
text("One",0,100);
text("Two",50,200);
text(3,100,300);
}

21. Complete!
100%
boolean 型
グローバル変数
配列
添え字式 []
配列の範囲外アクセス
配列のサイズ
width
height
mouseX
mouseY
mousePressed
text()
textSize()

22. Practice [1/2]
boolean currentlyMousePressed = false;
int previousX = 0, previousY = 0;
void setup()
{
size(600,400);
background(255,255,255);
stroke(0,120,255);
strokeWeight(5); // width of the line
}
void draw()
{
if(mousePressed)
{
if(!currentlyMousePressed)
{
previousX = mouseX;
previousY = mouseY;
}
line(previousX,previousY,mouseX,mouseY);
previousX = mouseX;
previousY = mouseY;
currentlyMousePressed = true;
}
else
{
currentlyMousePressed = false;
}
}

23. Practice [2/2]
int[] blocks = new int[64];
void setup()
{
size(600,400);
colorMode(HSB,360,1.0,1.0);
}
void draw()
{
for(int i=0; i<blocks.length; ++i)
{
if(blocks[i]==1)
{
fill(i*5, 1.0, 1.0);
}
else
{
fill(0, 0.0, 1.0);
}
rect(i*10,0,64,height);
if(mousePressed)
{
int index = mouseX/10;
blocks[index] = 1;
}
}
}

24. Challenge
 マウスの操作で変化するアニメーションを
作ろう！

25.  続きは再来週の第 5 回で！

26. Questions?
@Reputeless