- 追加された行はこの色です。
- 削除された行はこの色です。
*入力するコード [#aaede2d5]
以下のコードを入力してください。
※Tabキーを押すと行頭に半角スペース2つが挿入されます。
>int x = 0;
>int y = 0;
>
>void setup() {
> size(300, 300);
>}
>void draw() {
> background(255);
> line(x, y, 100 + x, 100 + y);
> x = x + 1;
> y = y + 1;
>}
*結果 [#d424e51b]
以下のような画面が表示され、直線が画面左上から右下に移動したらOKです。
&ref(line_move_sample1.png);
*解説 [#we9ae389]
>int x = 0;
>int y = 0;
このプログラムで利用する変数を準備します。
変数については「[[変数について理解する]]」で詳しく解説します。
>void setup() {
> size(300, 300);
>}
「setup()」の後の{}の中には、プログラムが実行される前に１度だけ実行したい処理をまとめて書きます。ここでは「size(300, 300);」で画面の大きさを決めていますね。
>void draw() {
> background(255);
> line(x, y, 100 + x, 100 + y);
> x = x + 1;
> y = y + 1;
>}
「draw()」の後の{}の中には、何度も繰り返し実行したい処理をまとめて書きます。
> background(255);
これは文字通り背景の色を指定するものです。()の中身が0だと真っ黒、255だと真っ白になります。つまり、ここで一度背景を真っ白にしていることになります（なぜそんなことをしているかは後ほど）。
> line(x, y, 100 + x, 100 + y);
これは「[[基本の図形：直線]]」で学習した、直線を描くためのものです。
x, yはプログラム冒頭で準備した変数ですね。冒頭では「int x = 0;」「int y = 0;」とそれぞれしましたが、それによってx, yという変数はそれぞれ「0」になっています。
従って一番最初にこの処理が実行されるときには、
>line(0, 0, 100 + 0, 100 + 0);
と同じことになります。
> x = x + 1;
> y = y + 1;
ここで出てくる「=」は、数学の授業で用いる「=」とは用途が異なり、「右辺の計算結果を左辺に代入してね」という意味になります。
従って最初にこの処理が実行されるときには、
> x = 0 + 1;
> y = 0 + 1;
と同じことになり、x, yはそれぞれ「1」に代わります。
