2022年10月3日 星期一

week05 互動技術 08160873

 Step01:畫棋盤(運用等差級數的概念):

//畫棋盤

//等差級數

size(500,700);

for(int x=50;  x<=450;  x+=50){

  line(x, 50, x, 500);

}

//10條

for(int y=50; y<=500;y+=50){

  line(50, y, 450, y);

}

Step02.製造有楚河分界(上下半部)的棋盤:

//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 0, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
void setup(){
    size(500, 550);
}
void draw() {
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<4; i++) {
    for (int j=0; j<9; j++) {
      text(board[i][j], 50+j*50, 50+i*50);
    }
  }
}


step03:將國字製造出,並放上棋盤:

//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 6, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
String [] name={"將","士", "象","車", "馬", "包", "卒"};
void setup(){
    size(500, 550);
    PFont font = createFont("標楷體",30);
    textFont(font);
    textAlign(CENTER,CENTER);
}
void draw() {
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<4; i++) {
    for (int j=0; j<9; j++) {
      int id = board[i][j];//1開始
      if( id==0) continue;//陣列麻煩回去(繼續)
      text(name[id-1], 50+j*50, 50+i*50);
    }
  }
}
step04:做出紅黑顏色以及棋子本身:
//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 6, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//上面為黑色
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//下面為紅色
  {-7, 0, -7, 0, -7, 0, -7, 0, -7},
  {0, -6, 0, 0, 0, 0, 0, -6, 0},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {-4, -5, -3, -2, -1, -2, -3, -5, -4},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
String [] name={"將","士", "象","車", "馬", "包", "卒"};
String [] name2={"帥","仕", "相","俥", "傌", "炮", "兵"};
void setup(){
    size(500, 550);
    PFont font = createFont("標楷體",30);
    textFont(font);
    textAlign(CENTER,CENTER);
}
void draw() {
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<10; i++) {
    for (int j=0; j<9; j++) {
      int id = board[i][j];//1開始
      if( id==0) continue;//陣列麻煩回去(繼續)
      if(id>0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(0);
        text(name[id-1], 50+j*50, 50+i*50-3); 
      }else if(id<0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(255,0,0);
        text(name2[-id-1], 50+j*50, 50+i*50-3);
      
      } 
    }
  }
}


step05:當滑鼠按下,
//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 6, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//上面為黑色
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//下面為紅色
  {-7, 0, -7, 0, -7, 0, -7, 0, -7},
  {0, -6, 0, 0, 0, 0, 0, -6, 0},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {-4, -5, -3, -2, -1, -2, -3, -5, -4},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
String [] name={"將","士", "象","車", "馬", "包", "卒"};
String [] name2={"帥","仕", "相","俥", "傌", "炮", "兵"};
void setup(){
    size(500, 550);
    PFont font = createFont("標楷體",30);
    textFont(font);
    textAlign(CENTER,CENTER);
}
void draw() {
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<10; i++) {
    for (int j=0; j<9; j++) {
      int id = board[i][j];//1開始
      if( id==0) continue;//陣列麻煩回去(繼續)
      if(id>0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(0);
        text(name[id-1], 50+j*50, 50+i*50-3); 
      }else if(id<0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(255,0,0);
        text(name2[-id-1], 50+j*50, 50+i*50-3);
      
      } 
    }
  }
}
void mousePressed(){
  for(int i=0; i<10; i++){
    for(int j=0;j<9;j++){
      if(dist(mouseX,mouseY,50+j*50, 50+i*50)<20){
        board[i][j]=1;
      }
    }
  }
}


Step06:可移動棋子,還有加入背景:
//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 6, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//上面為黑色
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//下面為紅色
  {-7, 0, -7, 0, -7, 0, -7, 0, -7},
  {0, -6, 0, 0, 0, 0, 0, -6, 0},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {-4, -5, -3, -2, -1, -2, -3, -5, -4},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
String [] name={"將","士", "象","車", "馬", "包", "卒"};
String [] name2={"帥","仕", "相","俥", "傌", "炮", "兵"};
void setup(){
    size(500, 550);
    PFont font = createFont("標楷體",30);
    textFont(font);
    textAlign(CENTER,CENTER);
}
void draw() {
  background(#F09C2E);
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<10; i++) {
    for (int j=0; j<9; j++) {
      int id = board[i][j];//1開始
      if( id==0) continue;//陣列麻煩回去(繼續)
      if(id>0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(0);
        text(name[id-1], 50+j*50, 50+i*50-3); 
      }else if(id<0){
        fill(255);
        ellipse(50+j*50, 50+i*50, 40, 40);
        fill(255,0,0);
        text(name2[-id-1], 50+j*50, 50+i*50-3);
      
      } 
    }
  }
  if(handChess!=0) ellipse(mouseX,mouseY,40,40);
}
int handChess=0;
void mousePressed(){
  for(int i=0; i<10; i++){
    for(int j=0;j<9;j++){
      if(dist(mouseX,mouseY,50+j*50, 50+i*50)<20){
        handChess = board[i][j];//手上的棋子放到棋盤
        board[i][j]=0;//手上的棋子 清空
      }
    }
  }
}
void mouseReleased(){
  int i = (mouseY+25-50)/50;
  int j = (mouseX+25-50)/50;
  board[i][j]=handChess;
  handChess = 0;
}


Chess_Better:
//畫棋子,要互動
int [][]board={
  {4, 5, 3, 2, 1, 2, 3, 5, 4},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {0, 6, 0, 0, 0, 0, 0, 6, 0},
  {7, 0, 7, 0, 7, 0, 7, 0, 7},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//上面為黑色
  {0, 0, 0, 0, 0, 0, 0, 0, 0},//下面為紅色
  {-7, 0, -7, 0, -7, 0, -7, 0, -7},
  {0, -6, 0, 0, 0, 0, 0, -6, 0},
  {0, 0, 0, 0, 0, 0, 0, 0, 0},
  {-4, -5, -3, -2, -1, -2, -3, -5, -4},
};//將:1 士:2 象:3 車:4 馬:5 包:6 卒:7
String [] name={"將","士", "象","車", "馬", "包", "卒"};
String [] name2={"帥","仕", "相","俥", "傌", "炮", "兵"};
void setup(){
    size(500, 550);
    PFont font = createFont("標楷體",30);
    textFont(font);
    textAlign(CENTER,CENTER);
}
void draw() {
  background(#F09C2E);
  for (int x=50; x<=450; x+=50) {
    line(x, 50, x, 250);
    line(x, 300, x, 500);
  }
  //10條
  for (int y=50; y<=500; y+=50) {
    line(50, y, 450, y);
  }
  for (int i=0; i<10; i++) {
    for (int j=0; j<9; j++) {
      int id = board[i][j];//1開始
      if( id==0) continue;//陣列麻煩回去(繼續)
      drawChess(50+j*50,50+i*50,id);
    }
  }
  if(handChess!=0) drawChess(mouseX,mouseY,handChess);
}
void drawChess(int x, int y, int id){
  fill(255);
  ellipse( x, y, 40, 40);
  if(id>0){
    fill (0);
    text( name[id-1], x, y-3); 
  }else{
    fill(255,0,0);
    text( name2[-id-1], x, y-3);
  }
}
int handChess=0;
void mousePressed(){
  for(int i=0; i<10; i++){
    for(int j=0;j<9;j++){
      if(dist(mouseX,mouseY,50+j*50, 50+i*50)<20){
        handChess = board[i][j];//手上的棋子放到棋盤
        board[i][j]=0;//手上的棋子 清空
      }
    }
  }
}
void mouseReleased(){
  int i = (mouseY+25-50)/50;
  int j = (mouseX+25-50)/50;
  board[i][j]=handChess;
  handChess = 0;
}


製作暗棋:
int [][]show={
  {0, 0, 0, 0, 0, 0, 0, 0},
  {0, 0, 0, 0, 0, 0, 0, 0},
  {0, 0, 0, 0, 0, 0, 0, 0},
  {0, 0, 0, 0, 0, 0, 0, 0},
};//翻牌前,0 都不會秀
int [][]board={
  { 1, 2, 2, 3, 3, 4, 4, 5},
  { 5, 6, 6, 7, 7, 7, 7, 7},
  {-1,-2,-2,-3,-3,-4,-4,-5},
  {-5,-6,-6,-7,-7,-7,-7,-7}
}; //暗棋的格子,比較少 4x8=32個棋子
void setup(){
  size(500,400);
  PFont font = createFont("標楷體", 30);
  textFont(font);
  textAlign(CENTER, CENTER);
}
void draw(){
  background(#F0B82C);
  for (int x=50; x<=450; x+=50) {
    line( x, 50, x, 250);
  }
  for (int y=50; y<=250; y+=50) {
    line( 50, y, 450, y);
  }  
  for(int i=0; i<4; i++){
    for(int j=0; j<8; j++){
      if(show[i][j]==0){
        fill(255);
        ellipse(50+25+j*50, 50+25+i*50,40,40);
      }else{
        int id = board[i][j];
        drawChess(50+25+j*50, 50+25+i*50, id);
      }
    }
  }
}
void mousePressed(){
  for(int i=0; i<10; i++){
    for(int j=0; j<9; j++){
      if(dist(mouseX,mouseY,50+25+j*50, 50+25+i*50)<20){
        if(show[i][j]==0 ) show[i][j] = 1;//
      }
    }
  }
}
String [] name = {"將", "士", "象", "車", "馬", "包", "卒"};
String [] name2 = {"帥", "仕", "相", "俥", "傌", "炮", "兵"};
void drawChess(int x, int y, int id){
    fill(255);
    ellipse( x, y, 40, 40);
    if(id>0){//黑
      fill(0);
      text( name2[id-1], x, y-3);
    }else{//紅
      fill(255,0,0);
      text( name2[-id-1], x, y-3);
    }
}





















沒有留言:

張貼留言