本帖最後由 2266 於 2021-12-5 19:45 編輯
- int image_number =16; // 設定有幾張圖片
- int howManyAnswers = 4; //answer有幾張
- PImage[] imgAnswer = new PImage[howManyAnswers];
- float answerImageWidth = 200; //answer圖片的寬
- float imageRandomWidth = 105; //設定隨機置圖區的方格寬度,會比原圖稍寛好有留白
- float imageWidth = 100; //中間拼圖區的格子寬
- float[] imgX = new float[image_number]; //圖片的x坐標設成陣列
- float[] imgY = new float[image_number]; //圖片的y坐標設成陣列
- float[] imgCenterX = new float[image_number]; //中央拼圖區格線x坐標
- float[] imgCenterY = new float[image_number]; //中央拼圖區格線y坐標
- PImage[] imgToySoldier = new PImage[image_number]; //四個圖片陣列的設定
- PImage[] imgSnowNight = new PImage[image_number];
- PImage[] imgKnight = new PImage[image_number];
- PImage[] imgXmasGirl = new PImage[image_number];
- PImage[] imgRandom = new PImage[image_number]; //隨機置圖的圖片陣列
- boolean[] bbb = new boolean[image_number];
- PImage blankImage;
- PImage checkIfExist; //在隨機置圖區中用來檢查是否已放置的圖片
- //用以檢查是否圖片已放置的函數
- boolean isItExisted(int y,PImage pi, PImage[] pic){ //參數一是要檢查的圖片數,參數二是被檢查的圖片,參數三是用來檢查該圖是否已出現過的圖片陣列
- boolean exist = false; //先預設為 false
- for(int i=0;i<y;i++)
- if(pi==pic[i]) exist = true; //如果循序檢查發現該圖等於陣列中的某圖,表示已出現過,則exist等於true並回報之
- return exist;
- }
- //函數結數
-
- // 隨機圖片排列函數
- void imageRandomly(PImage[] toBeRandomed){ //參數是要被隨機排的現有圖片陣列
- PImage checkIt; //要放到isItExisted()中檢查是否已存在的圖片
- for(int x=0;x<image_number;x++) imgRandom[x] = loadImage("img_100_4/blank.png"); //給blank圖片的值不是為了排出空格,而是為了之後變更成其他圖片
- for(int x=0;x<image_number;x++)
- {
- do{
- checkIt = toBeRandomed[int(random(0,image_number))];} //將隨機的圖片指定給 checkIt
- while(isItExisted(image_number,checkIt,imgRandom)); //將 checkIt 放入參數檢查回報是否為 true,若為 true 繼續回到上一動作,若false則結束並至下一動作
- imgRandom[x] = checkIt; //將checkIt目前的圖片指給隨機圖片陣列的第某項
- }
- }
- //
-
- //定出隨機區的格子和各格子的xy坐標
- void setGrid(){
-
- for(int i=0;i<image_number;i++)
- if(i%2==0) //逢二的倍數
- {
- imgX[i] = 750; //x坐標不變
- imgY[i] = 50+i/2*imageRandomWidth; //y坐標從50起加上(先將i除二是因為逢二個才會乘一次,然後乘上設定好的寬度)
- }
- else {
- imgX[i]=750+imageRandomWidth; //x坐標加上設定好的寬度
- imgY[i] = imgY[i-1]; //y坐標維持和上一個的一樣
- }
- }
- //
- void playIt(){
-
- for(int i=0;i<16;i++){
- image(imgRandom[i],imgX[i],imgY[i]);
-
- if(bbb[i]) {imgX[i] = mouseX-imageWidth/2;imgY[i] = mouseY-imageWidth/2;} //當該圖的boolean為true,則該圖可移動,並將滑鼠保持在圖中央
- if(!mousePressed)
- {
- bbb[i] = false;
- for(int t=0;t<4;t++)
- for(int s=0;s<4;s++)
- if(abs(imgX[i]-imgCenterX[t])<30&& abs(imgY[i]-imgCenterY[s])<30)
- {
- imgX[i] = imgCenterX[t];
- imgY[i] = imgCenterY[s];
- }
-
- }
- }
- }
-
-
-
-
- void setup(){
- size(1000,1000);
- // 給四個answer圖片的值
- imgAnswer[0] = loadImage("img_100_4/answerKnight.png");
- imgAnswer[1] = loadImage("img_100_4/answerAliceTable.png");
- imgAnswer[2] = loadImage("img_100_4/answerKremlin.png");
- imgAnswer[3] = loadImage("img_100_4/answerFu.png");
- //先設定中間拼圖區的xy坐標各有四種數值
- for(int i=0;i<4;i++)
- {
- imgCenterX[i] = 300 + i*imageWidth;
- imgCenterY[i] = 200 + i*imageWidth;
- }
- //
-
- for(int x=0;x<image_number;x++)
- {
- imgKnight[x] = loadImage("img_100_4/knight/"+x+".png"); //先給圖片陣列賦值
- imgToySoldier[x] = loadImage("img_100_4/fu/"+x+".png"); //先給圖片陣列賦值
- imgSnowNight[x] = loadImage("img_100_4/kremlin/"+x+".png"); //先給圖片陣列賦值
- imgXmasGirl[x] = loadImage("img_100_4/alicetable/"+x+".png"); //先給圖片陣列賦值
- bbb[x] = false; //boolean 先都設為false;
- }
-
- setGrid(); //設定好隨機區的格線坐標位置
- imageRandomly(imgKnight); //先用一個圖片陣列放入隨機圖片陣列
- }
-
- void draw(){
-
- background(255);
- //設定answer大圖的顯示
- for(int i=0;i<howManyAnswers;i++)
- image(imgAnswer[i],30,50+i*(answerImageWidth+10));
-
- //在中間畫出4x4的拼圖格線
- for(int i=0;i<4;i++)
- for(int j=0;j<4;j++)
- rect(imgCenterX[i],imgCenterY[j],imageWidth,imageWidth);
- //
-
- // 將已有圖的隨機圖片陣列放到隨機區各格子中
- for(int i=0;i<image_number;i++){
- image(imgRandom[i],imgX[i],imgY[i]);
- }
- playIt();
- }
- void mousePressed(){
- //先保證所有的牌boolean是false,但唯有滑鼠點到那張是true,以免移動到其他牌
- for(int i=0;i<16;i++)
- if(mouseX>imgX[i]&&mouseX<imgX[i]+imageWidth&&mouseY>imgY[i]&&mouseY<imgY[i]+imageWidth)
- {
- for(int j=0;j<16;j++) bbb[j] = false;
- bbb[i]=true;
- }
-
-
- //如果滑鼠在不同區中按下,則隨機區放入不同的圖片陣列
- if(mouseX>30&&mouseX<230&&mouseY>50&&mouseY<250) {
- setGrid(); //要重設一切隨機區,不然已在拼圖區的圖片座標可會留在拼圖區
- imageRandomly(imgKnight);
- }
-
- if(mouseX>30&&mouseX<230&&mouseY>260&&mouseY<460) {
- setGrid();
- imageRandomly(imgXmasGirl);}
-
- if(mouseX>30&&mouseX<230&&mouseY>470&&mouseY<670) {
- setGrid();
- imageRandomly(imgSnowNight);}
-
- if(mouseX>30&&mouseX<230&&mouseY>690&&mouseY<890) {
- setGrid();
- imageRandomly(imgToySoldier);}
-
- }
複製代碼 |