永夜初晗凝碧天 week01

 step01

大小

```

size(500,500);

```

顏色

```java

size(500,500);

background(#A00028);

```

step02

塗顏色的長方形

```java

size(500,500);

background(#A00028);

fill(#FC952E);

rect(100,100, 100,150);

```

會移動的長方形

```java

void setup()

{

  size(500,500);

}

void draw()

{

  background(#A00028);

  fill(#FC952E);

  rect(100,100, 100,150);

  rect(mouseX,mouseY, 100,150);

}

```

下載p5.js

把互動程式存進網路

```p5.js

function setup() 

{

    initializeFields();

    createCanvas(500, 500);

}

function draw() 

{

    background(color(0xA0, 0x00, 0x28));

    fill(color(0xFC, 0x95, 0x2E));

    rect(100, 100, 100, 150);

    rect(mouseX, mouseY, 100, 150);

}

function initializeFields() {

}

```

step03

製作小畫家

```java

void setup()

{

  size(500,500);

}

void draw()

{

  if(mousePressed) line(mouseX,mouseY, pmouseX,pmouseY);

}

```

色筆小畫家

```java

void setup()

{

  size(500,500);

  background(#AF5C09);//先背景

  stroke(0,0,0);//筆觸黑色

}

void draw()

{

  if(mousePressed) line(mouseX,mouseY, pmouseX,pmouseY);

}

void keyPressed()//按按鍵

{

  if(key=='1') stroke(#2309D3);

  if(key=='2') stroke(#3FBC0F);

  if(key=='3') stroke(#FF0009);

}

```