STEP 01
1.開啟processing
2.開視窗並加上3D功能(P3D),畫背景
3.使用以前電腦圖學教的備份還原矩陣,建個盒子讓它跟著滑鼠座標移動
STEP 02
1.以剛才程式碼為基礎,再加上rotate讓盒子轉動
2.以Y軸做轉動為例:
STEP 03
1.用fill();給盒子填充顏色
2.再建立一個盒子,並把它放大(scale)兩倍
STEP 04
1.開啟一個新的processing
2.要做新的東西,類似摺紙的,於是試著使用資料結構
3.建立大的資料結構,並用特殊的for迴圈通過小的資料結構,達成滑鼠點擊得橢圓的目標
STEP 051.我們使用第二個特殊for迴圈做頂點,頂點(vertex)可圈出需要的範圍
STEP 06
1.現在只能畫點跟框範圍,顯然不夠,要將滑鼠左右鍵功能分開
2.打算讓左鍵畫頂點跟橢圓,右鍵讓框起來的部分旋轉
3.再次使用備份還原矩陣以及之前電腦圖學課學過的TRT,使其右鍵有旋轉功能
STEP 071.開新檔案,測試選取左中右鍵的程式
STEP 08
1.摺紙會有要點對點的情況,因此要能選擇頂點
2.利用ans變數不為空值畫一個稍大於頂點的圓,達成選取的效果3.加入拖曳的程式碼,並且將滑鼠的三個鍵功能分開,加點設為左鍵,拖曳設置在中鍵
STEP 09
1.加點位置錯誤雖然可以調整位置,但目前無法減少點的數量,所以要加上刪除點的功能,設置在剩下的右鍵
final code:
ArrayList<PVector>pt;//大的資料結構
void setup(){
size(400,400,P3D);
pt = new ArrayList<PVector>();//初始化,把大的資料結構準備好(裡面要放小的資料結構)
for(int i=0;i<37;i++){
pt.add( new PVector(random(400), random(400) ) );//假設畫面點好37個頂點
}
}
void draw(){
background(#39C5BB);
for(PVector p : pt){ //畫出全部的頂點
ellipse(p.x, p.y, 10, 10);
}
if(ans!=null) ellipse(ans.x, ans.y, 15, 15);
}
PVector ans = null;
void mouseDragged(){//拖曳
if(mouseButton==CENTER && ans!=null){
ans.x = mouseX;
ans.y = mouseY;
}
}
void mousePressed(){//點擊
if(mouseButton==LEFT) pt.add( new PVector(mouseX,mouseY) );
else if(mouseButton==CENTER){
for(PVector p : pt){
if(dist(p.x,p.y,mouseX,mouseY)<5){
ans = p;
}
}
}else if(mouseButton==RIGHT){//右鍵,要刪除,要用傳統的for迴圈
for(int i=0;i<pt.size();i++){//要寫2行,才等於特殊的1行
PVector p = pt.get(i);//2行
if(dist(p.x, p.y, mouseX, mouseY) < 5 ){//找到夠近的點
pt.remove(i);//把第i個點刪掉(刪的時候,會把大資料結構右邊的都左移一格)
}
}
}
}










沒有留言:
張貼留言