01初階及相關教學網站

回覆文章
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

01初階及相關教學網站

文章 cajhbb »

01初階及相關教學網站
https://www.bilibili.com/video/BV1ck4y1 ... pageDriver
https://www.processing.love/t/share 作品分享

代碼: 選擇全部

void setup()//圖層順序程式後面蓋前面
{
size(600,600);//畫布大小
background(255,0,0);
//二值為灰階值
//RGB三值,若四值為"透明度0~255-Alpha值
ellipse(0,0,100,300);//橢圓
//左上角起算,圓心ellipse(心x軸,心y軸,寛,高)
noFill();//不填充 
fill(0,255,255);//填充顏色
//noStroke();//去邊框
strokeWeight(20);//加邊框,往外10,往內10
stroke(0,255,0);//邊框顏色
rect(100,100,200,400);
rect(40,random(50,100),200,200);//random(初,終)隨機
//rect(左上x,左上y,寛,高)
}
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

ex02

文章 cajhbb »

代碼: 選擇全部

void setup()//圖層順序程式後面蓋前面
{
size(600,600);//畫布大小
background(255);
//frameRate(18);//每秒8次
}
void draw()//每秒鐘可運行內部多次
{
  fill(random(0,255),random(0,255),random(0,255));
  strokeWeight(3);
  stroke(random(0,255),random(0,255),random(0,255));
  rect(random(0,600),random(0,600),random(0,600),random(0,600));
}
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

程式分區塊

文章 cajhbb »

代碼: 選擇全部

//--------習慣將程式分成三個區塊以上------------
int c;
float b;
//boolean
//------------------------------------
void setup()
{
  size(600,600);//畫布大小
  //background(255);//畫布顏色
  frameRate(130);//每秒130個frame
}
//------------------------------------
void draw()
{
  c++;//c=c+1
  background(c);//畫布顏色
  fill(random(0,255),random(0,255),random(0,255));
  strokeWeight(5);//框線=5
  stroke(random(0,255),random(0,255),random(0,255));//框線顏色
  rect(random(0,600),random(0,600),20,20);//矩形
}
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

與滑鼠交互作用

文章 cajhbb »

代碼: 選擇全部

//----------顏色滑鼠交互作用--------------
void setup()
{
  size(600,600);//畫布大小
}
//------------------------------------
void draw()
{
  background(mouseX/3,mouseY/3,100);//畫布顏色與滑鼠改變
  fill(255);
  rect(mouseX,mouseY,142,123);//左上與滑鼠同+矩形寛高
  //mouseX,mouseY
}
ex04.png
ex04.png (2.31 KiB) 已瀏覽 1497 次

代碼: 選擇全部

//----------顏色滑鼠交互作用--------------
void setup()
{
  size(600,600);//畫布大小
  background(255);
}
//------------------------------------
void draw()
{
  fill(255);
  rect(mouseX,mouseY,142,223);//左上與滑鼠同+矩形寛高
  //mouseX,mouseY
}
2023-04-07_143442.png
2023-04-07_143442.png (17.56 KiB) 已瀏覽 1493 次
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

for循環

文章 cajhbb »

代碼: 選擇全部

//----------for循環--------------
void setup()
{
  size(600,600);//畫布大小
  background(255);
}
//------------------------------------
void draw()
{
  for(int i=0;i<120;i++)
  {
    fill(4*i,i,3*i);
    rect(2*i,2*i,100,350); 
  }
 
}
2023-04-07_145056.png
2023-04-07_145056.png (24.09 KiB) 已瀏覽 1492 次

代碼: 選擇全部

//----------for巢狀循環--------------
void setup()
{
  size(800,800);//畫布大小
  background(255);
}
//------------------------------------
void draw()
{
  for(int i=0;i<15;i++)
  {
    for(int j=0;j<15;j++)
    {
      fill(15*i,10*j,i*j);
      rect(50*i,50*j,40,40);
    }
  }
}
2023-04-07_150211.png
2023-04-07_150211.png (70.01 KiB) 已瀏覽 1492 次
動態微調
2023-04-07_151838.png
2023-04-07_151838.png (38.58 KiB) 已瀏覽 1491 次
2023-04-07_152256.png
2023-04-07_152256.png (180.78 KiB) 已瀏覽 1490 次
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

滑鼠壓住及滑動

文章 cajhbb »

代碼: 選擇全部

int c=0;
//------------------------
void setup()
{
  size(800,800);//畫布大小
  background(255);
}
//------------------------------------
void draw()
{
  if(mousePressed)fill(255,0,0);//滑鼠壓,紅色 
  else fill(0,255,0);//否則綠色
  rect(mouseX,mouseY,50,50);
}
2023-04-07_161042.png
2023-04-07_161042.png (40.58 KiB) 已瀏覽 1489 次
cajhbb
系統管理員
文章: 906
註冊時間: 2018年 6月 30日, 02:16

while畫線line

文章 cajhbb »

代碼: 選擇全部

int i=0;
void setup()
{
  size(400,400);
  background(255);
}
void draw()
{
  while(i<80)
  {
    stroke(255,0,0);//邊框顏色
    strokeWeight(3);
    line(30,5*i,30+3*i,5*i);
    //line(x1,y1,x2,y2);
    i=i+1;
  }
}
2023-04-09_220025.jpg
2023-04-09_220025.jpg (24.36 KiB) 已瀏覽 1480 次
回覆文章