TC*(˙Ⱉ˙ฅ)​-week02

 學習製作卡牌遊戲

第一個程式:week02_1_one_card

rect( x, y , 寬,高, 邊框圓滑度);

或是rect ( x ,  y , 寬, 高,  左上圓滑, 右上圓滑, 右下圓滑, 左下圓滑); 對各邊進行設定

畫一個卡片

//畫卡片

size(500,500);//視窗大小

int W=25;

rect(100-W/2,100-W/2,150+W,250+W,20);//弧度//白色底

fill(#6AFFA4);//填滿顏色

rect(100,100,150,250,20);//較小的

第二個程式:week02_2_many_drawCard_function

建立一個drawCard函式和變數呼叫多張卡牌

用x,y控制位置、用a來設定長寬的變化

畫很多個卡片
void setup()
{
  size(500,500);
}
int W=25;
void draw()
{
  drawCard(100,100);//使用函式
  drawCard(130,130);//使用函式
  drawCard(160,160);//使用函式
}
void drawCard(int x,int y)//建立函式
{
  fill(255);//白色
  rect(x-W/2,y-W/2,150+W,250+W,20);//最後的20是弧度
  fill(#6AFFA4);//填滿顏色//綠色
  rect(x,y,150,250,20);//較小的
}

第一個程式和第二個程式的關聯性

一個一個卡片寫的效率太慢了，因此把重複的設定利用一個函式統整起來

接下來正式進入Poker的製作~

來看一下程式的基本設定吧!!

textSize( 大小 ); --->設定字體大小

text( 文字 , 位置x , 位置 y ); --->設定文字和文字擺放的位置

在 drawPokerCard()  設定一個字串(String)  face

PFont(PFont是變數名稱)  font  --->建立一個字形的變數

createFont( " 字體 " , 大小 ); --->設定內建的一個字型，另一種讀字體檔方法loadFont("字體檔案"); 

textFont(" 字體變數 "); --->套用字型

變數 . indexOf(" 字 ") --->可以測變數裡面有沒有這個字，而變數.indexOf( "  字 ") == -1--->則表示變數裡沒有這個字

第三個程式:week02_3_poker_cards

void setup()

{

  size(500,500);

}

int W=25;

void draw()

{

  drawPokerCard(100,100,"S4");//使用函式

  drawPokerCard(130,150,"H3");//使用函式

  drawPokerCard(160,200,"D5");//使用函式

  drawPokerCard(190,250,"CJ");//使用函式

}

//牌面:黑桃Spades 紅心Hearts 方塊Diamonds 梅花Clubs

void drawPokerCard(int x,int y,String face)//牌面

{

  fill(255);//白色

  rect(x-W/2,y-W/2,150+W,250+W,20);//弧度

  fill(#6AFFA4);//填滿顏色//綠色

  rect(x,y,150,250,20);//較小的

  fill(0);//黑色

  textSize(40);

  text(face,x,y+40);

}

第二與第三個程式的對比

第四個程式:week02_4_PFont_createFont_textFont

將第三個程式的SHDC改成中文黑桃愛心方塊梅花

void setup()

{

  size(500,500);

  PFont font = createFont("標楷體",40);//調整字形與字體大小

  textFont(font);//宣告變數名稱

}

int W=25;

void draw()

{

  drawPokerCard(100,100,"黑桃4");//使用函式

  drawPokerCard(130,150,"愛心3");//使用函式

  drawPokerCard(160,200,"方塊5");//使用函式

  drawPokerCard(190,250,"梅花J");//使用函式

}

//牌面:黑桃Spades 紅心Hearts 方塊Diamonds 梅花Clubs

void drawPokerCard(int x,int y,String face)//牌面

{

  fill(255);//白色

  rect(x-W/2,y-W/2,150+W,250+W,20);//弧度

  fill(#6AFFA4);//填滿顏色//綠色

  rect(x,y,150,250,20);//較小的

  fill(0);//黑色

  textSize(40);//字體大小

  text(face,x,y+40);

}

第五個程式:week02_5_if_indexOf_is_negtive_change_fill_color

修改愛心與方塊的顏色

void setup()

{

  size(500,500);

  PFont font = createFont("標楷體",40);//調整字形與字體大小

  textFont(font);//宣告變數名稱

}

int W=25;

void draw()

{

  drawPokerCard(100,100,"黑桃4");//使用函式

  drawPokerCard(130,150,"愛心3");//使用函式

  drawPokerCard(160,200,"方塊5");//使用函式

  drawPokerCard(190,250,"梅花J");//使用函式

}

//牌面:黑桃Spades 紅心Hearts 方塊Diamonds 梅花Clubs

void drawPokerCard(int x,int y,String face)//牌面

{

  fill(255);//白色

  rect(x-W/2,y-W/2,150+W,250+W,20);//弧度

  fill(#6AFFA4);//填滿顏色//綠色

  rect(x,y,150,250,20);//較小的

  //fill(0);//黑色的字(下面三行是修改)

  if(face.indexOf("黑桃") == -1 && face.indexOf("梅花") == -1)//如果不是黑桃或梅花

  fill(#FF0000);//字體顏色改成紅色

  else fill(0);

  textSize(40);//字體大小

  text(face,x,y+40);

}

接下來我們要利用亂數取牌

random( ); --->random出來的值是flaot，這裡要整數所以直接專換成int

String flower --->設定放花色的陣列

String face1 .....;--->設定每張牌的變數

face1  --->是來放亂數取好後放入的變數(依次類推)

void setup()

{

  size(500,500);

  PFont font = createFont("標楷體",40);//調整字形與字體大小

  textFont(font);//宣告變數名稱

  String [] flower = {"黑桃","紅心","方塊","梅花"};//陣列

  face1 = flower[int(random(4))]+int(random(13)+1);

  face2 = flower[int(random(4))]+int(random(13)+1);

  face3 = flower[int(random(4))]+int(random(13)+1);

  face4 = flower[int(random(4))]+int(random(13)+1);

  //取整數0...12所以再加1

}//洗牌的英文:shuffle

String face1,face2,face3,face4;

void draw()

{

  drawPokerCard(100,100,face1);//使用函式

  drawPokerCard(130,150,face2);//使用函式

  drawPokerCard(160,200,face3);//使用函式

  drawPokerCard(190,250,face4);//使用函式

}

//牌面:黑桃Spades 紅心Hearts 方塊Diamonds 梅花Clubs

void drawPokerCard(int x,int y,String face)//牌面

{

  int W=25;

  fill(255);//白色

  rect(x-W/2,y-W/2,150+W,250+W,20);//弧度

  fill(#6AFFA4);//填滿顏色//綠色

  rect(x,y,150,250,20);//較小的

  //fill(0);//黑色的字(下面三行是修改)

  if(face.indexOf("黑桃") == -1 && face.indexOf("梅花") == -1)//如果不是黑桃或梅花

  fill(#FF0000);//字體顏色改成紅色

  else fill(0);

  textSize(40);//字體大小

  text(face,x,y+40);

}

第六個程式:week02_6_random_flower_number

void setup()

{

  size(500,500);

  PFont font = createFont("標楷體",40);//調整字形與字體大小

  textFont(font);//宣告變數名稱

  String [] flower = {"黑桃","紅心","方塊","梅花"};//陣列

  face1 = flower[int(random(4))]+int(random(13)+1);

  face2 = flower[int(random(4))]+int(random(13)+1);

  face3 = flower[int(random(4))]+int(random(13)+1);

  face4 = flower[int(random(4))]+int(random(13)+1);

  //取整數0...12所以再加1

}//洗牌的英文:shuffle

void mousePressed()//點擊左鍵隨機抽牌
{

  String [] flower = {"黑桃","紅心","方塊","梅花"};//陣列

  face1 = flower[int(random(4))]+int(random(13)+1);

  face2 = flower[int(random(4))]+int(random(13)+1);

  face3 = flower[int(random(4))]+int(random(13)+1);

  face4 = flower[int(random(4))]+int(random(13)+1);

  //取整數0...12所以再加1

}

String face1,face2,face3,face4;

void draw()

{

  drawPokerCard(100,100,face1);//使用函式

  drawPokerCard(130,150,face2);//使用函式

  drawPokerCard(160,200,face3);//使用函式

  drawPokerCard(190,250,face4);//使用函式

}

//牌面:黑桃Spades 紅心Hearts 方塊Diamonds 梅花Clubs

void drawPokerCard(int x,int y,String face)//牌面

{

  int W=25;

  fill(255);//白色

  rect(x-W/2,y-W/2,150+W,250+W,20);//弧度

  fill(#6AFFA4);//填滿顏色//綠色

  rect(x,y,150,250,20);//較小的

  //fill(0);//黑色的字(下面三行是修改)

  if(face.indexOf("黑桃") == -1 && face.indexOf("梅花") == -1)//如果不是黑桃或梅花

  fill(#FF0000);//字體顏色改成紅色

  else fill(0);

  textSize(40);//字體大小

  text(face,x,y+40);

}

目前抽卡小遊戲還有一個問題尚未解決
如果點擊隨機抽牌，會有出現重複的卡片問題

這部份我們留到下次上課在解決吧~

小提示:使用temp