2022年10月17日 星期一

雪⛄互動技術概論筆記-W7

  2022/10/17 Week07

# 複習象棋(暗棋)

1. 複製上週程式(可以翻牌的暗棋)

2. 修改程式 + 洗牌

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}

};///再翻牌前,都不會show出來

int [][]board={

  {1, 2, 2, 3, 3, 4, 4, 5},

  {7, 7, 7, 7, 7, 7, 7, 7},

  {-1, -2, -2, -3, -3, -4, -4, -5},

  {-7, -7, -7, -7, -7, -7, -7, -7},

};//1:將 2:士 3:象 4:車 5:馬 6:炮 7:卒

String [] name = {"將", "士", "象", "車", "馬", "包", "卒"};

String [] name2 = {"帥", "仕", "相", "俥", "瑪", "炮", "兵"};

void setup() {

  size(500, 300);

  PFont font = createFont("標楷體", 30);

  textFont(font);

  textAlign(CENTER, CENTER);

  for(int k=0; k<1000; k++){///洗牌1000次

    int i1 = int(random(4)), j1 = int(random(8));

    int i2 = int(random(4)), j2 = int(random(8));

    int temp = board[i1][j1];

    board[i1][j1]=board[i2][j2];

    board[i2][j2]=temp;

  }

}

void draw() {

  background(#D8B532);

  for (int x=50; x<=450; x+=50) { ///等差級數,畫棋盤

    line(x, 50, x, 250);

  }

  for (int y=50; y<=250; y+=50) { ///10條

    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<4; i++) {///這是錯的,要改!! ,棋子 直=>4

      for (int j=0; j<8; j++) {  ///棋子 =>8

        if (dist(mouseX, mouseY, 50+25+j*50, 50+25+i*50)<20) {

          if(show[i][j]==0) show[i][j] = 1; //show出來

          //下次上

        }

      }

    }

}

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);

  }

}


3. 移動棋子 + 多一點洗牌(函式)

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}

};///再翻牌前,都不會show出來

int [][]board={

  {1, 2, 2, 3, 3, 4, 4, 5},

  {7, 7, 7, 7, 7, 7, 7, 7},

  {-1, -2, -2, -3, -3, -4, -4, -5},

  {-7, -7, -7, -7, -7, -7, -7, -7},

};//1:將 2:士 3:象 4:車 5:馬 6:炮 7:卒

String [] name = {"將", "士", "象", "車", "馬", "包", "卒"};

String [] name2 = {"帥", "仕", "相", "俥", "瑪", "炮", "兵"};

void setup() {

  size(500, 300);

  PFont font = createFont("標楷體", 30);

  textFont(font);

  textAlign(CENTER, CENTER);

  for(int k=0; k<1000; k++){///洗牌1000次

    shuffle_one();

  }

}

void shuffle_one(){

  int i1 = int(random(4)), j1 = int(random(8));

  int i2 = int(random(4)), j2 = int(random(8));

  int temp = board[i1][j1];

  board[i1][j1]=board[i2][j2];

  board[i2][j2]=temp;

}


void draw() {

  background(#D8B532);

  for (int x=50; x<=450; x+=50) { ///等差級數

    line(x, 50, x, 250);

  }

  for (int y=50; y<=250; y+=50) { ///10條

    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);

      }

    }

  }

  if(moving){                /// moveJ / moveI跟上面j / i 呼應

    drawChess(50+25+moveJ*50, 50+25+moveI*50, 9);  ///9是什麼?

  }

}

int moveI = -1, moveJ = -1;

boolean moving = false;

void mousePressed(){

    shuffle_one();

    for (int i=0; i<4; i++) {

      for (int j=0; j<8; j++) {

        if (dist(mouseX, mouseY, 50+25+j*50, 50+25+i*50)<20) {

          if(show[i][j]==0) show[i][j] = 1; //show出來

          else{           ////移動棋子(要移哪一顆)

            moveI = i; ///我們想要移動的棋子 i座標

            moveJ = j; ///我們想要移動的棋子 j座標

            moving = true; ///正在移動

          }

        }

      }

    }

}

void drawChess(int x, int y, int id) {

  fill(255);

  ellipse(x, y, 40, 40);

  if(id==9){ ///帶移動的棋子(綠棋子)

    fill(0,255,0); //綠色

    ellipse(x, y, 40, 40);

  }

  else if (id>0) {

    fill(0);

    text(name[id-1], x, y-3);

  } else {

    fill(255, 0, 0);

    text(name2[-id-1], x, y-3);

  }

}


4. 移動棋子(原本的花色會在棋盤上)

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}

};///再翻牌前,都不會show出來

int [][]board={

  {1, 2, 2, 3, 3, 4, 4, 5},

  {7, 7, 7, 7, 7, 7, 7, 7},

  {-1, -2, -2, -3, -3, -4, -4, -5},

  {-7, -7, -7, -7, -7, -7, -7, -7},

};//1:將 2:士 3:象 4:車 5:馬 6:炮 7:卒

String [] name = {"將", "士", "象", "車", "馬", "包", "卒"};

String [] name2 = {"帥", "仕", "相", "俥", "瑪", "炮", "兵"};

void setup() {

  size(500, 300);

  PFont font = createFont("標楷體", 30);

  textFont(font);

  textAlign(CENTER, CENTER);

  for(int k=0; k<1000; k++){///洗牌1000次

    shuffle_one();

  }

}

void shuffle_one(){

  int i1 = int(random(4)), j1 = int(random(8));

  int i2 = int(random(4)), j2 = int(random(8));

  int temp = board[i1][j1];

  board[i1][j1]=board[i2][j2];

  board[i2][j2]=temp;

}


void draw() {

  background(#D8B532);

  for (int x=50; x<=450; x+=50) { ///等差級數

    line(x, 50, x, 250);

  }

  for (int y=50; y<=250; y+=50) { ///10條

    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);

      }

    }

  }

  if(moving){      ///移動棋子 原本位置的殘影   and     浮起來的棋子

    fill(0, 255, 0, 128); ///綠色,半透明(原來的位置變半透明)

    ellipse(50+25+moveJ*50, 50+25+moveI*50, 40, 40); ///40, 40=>棋子大小

    

    drawChess(mouseX, mouseY, moveID);///正在移動的棋子(滑鼠拉起來移動)

  }

}

int moveI = -1, moveJ = -1, moveID = -1;

boolean moving = false;

void mousePressed(){

    /// shuffle_one();

    for (int i=0; i<4; i++) {

      for (int j=0; j<8; j++) {

        if (dist(mouseX, mouseY, 50+25+j*50, 50+25+i*50)<20) {

          if(show[i][j]==0) show[i][j] = 1; //show出來

          else{ ////移動棋子(要移哪一顆)

            moveI = i; ///我們想要移動的棋子 i座標

            moveJ = j; ///我們想要移動的棋子 j座標

            moveID = board[i][j]; ///記錄哪一顆棋

            moving = true; ///正在移動

          }

        }

      }

    }

}

void drawChess(int x, int y, int id) {

  fill(255);

  ellipse(x, y, 40, 40);

  /*if(id==9){ ///帶移動的棋子(綠棋子)

    fill(0,255,0); //綠色

    ellipse(x, y, 40, 40);

  }

  else*/ if (id>0) {

    fill(0);

    text(name[id-1], x, y-3);

    

  } else {

    fill(255, 0, 0);

    text(name2[-id-1], x, y-3);

  }

}


5. 承接上面,滑鼠放開棋子 將移動到的新位置上的棋子 吃掉

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}

};///再翻牌前,都不會show出來

int [][]board={

  {1, 2, 2, 3, 3, 4, 4, 5},

  {7, 7, 7, 7, 7, 7, 7, 7},

  {-1, -2, -2, -3, -3, -4, -4, -5},

  {-7, -7, -7, -7, -7, -7, -7, -7},

};//1:將 2:士 3:象 4:車 5:馬 6:炮 7:卒

String [] name = {"將", "士", "象", "車", "馬", "包", "卒"};

String [] name2 = {"帥", "仕", "相", "俥", "瑪", "炮", "兵"};

void setup() {

  size(500, 300);

  PFont font = createFont("標楷體", 30);

  textFont(font);

  textAlign(CENTER, CENTER);

  for(int k=0; k<1000; k++){///洗牌1000次

    shuffle_one();

  }

}

void shuffle_one(){

  int i1 = int(random(4)), j1 = int(random(8));

  int i2 = int(random(4)), j2 = int(random(8));

  int temp = board[i1][j1];

  board[i1][j1]=board[i2][j2];

  board[i2][j2]=temp;

}


void draw() {

  background(#D8B532);

  for (int x=50; x<=450; x+=50) { ///等差級數

    line(x, 50, x, 250);

  }

  for (int y=50; y<=250; y+=50) { ///10條

    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);

      }

    }

  }

  if(moving){

    fill(0, 255, 0, 128); ///綠色,半透明(原來的位置變半透明)

    ellipse(50+25+moveJ*50, 50+25+moveI*50, 40, 40); ///40, 40=>棋子大小

    

    drawChess(mouseX, mouseY, moveID);///正在移動的棋子(滑鼠拉起來移動)

  }

}

int moveI = -1, moveJ = -1, moveID = -1;

boolean moving = false;

void mouseReleased(){  ///滑鼠放開,吃掉 新位置上的棋子

  for (int i=0; i<4; i++) {

      for (int j=0; j<8; j++) {

        if (dist(mouseX, mouseY, 50+25+j*50, 50+25+i*50)<20) {

          if(moving){

            board[moveI][moveJ] = 0;  //棋盤位置沒有棋子

            board[i][j] = moveID;  ///

            moving = false;/// 停止移動

          }

        }

      }

  }

}

void mousePressed(){ ///滑鼠按下去,準備吃新位置的棋子

    for (int i=0; i<4; i++) {

      for (int j=0; j<8; j++) {

        if (dist(mouseX, mouseY, 50+25+j*50, 50+25+i*50)<20) {

          if(show[i][j]==0) show[i][j] = 1; //show出來

          else{ ////移動棋子(要移哪一顆)

            moveI = i; ///我們想要移動的棋子 i座標

            moveJ = j; ///我們想要移動的棋子 j座標

            moveID = board[i][j]; ///記錄哪一顆棋

            moving = true; ///正在移動

          }

        }

      }

    }

}

void drawChess(int x, int y, int id) {

  if(id==0) return; ///沒有棋子,不要跑下面!

  fill(255);

  ellipse(x, y, 40, 40);

  /*if(id==9){ ///帶移動的棋子(綠棋子)

    fill(0,255,0); //綠色

    ellipse(x, y, 40, 40);

  }

  else*/ if (id>0) {

    fill(0);

    text(name[id-1], x, y-3);

    

  } else if(id<0){

    fill(255, 0, 0);

    text(name2[-id-1], x, y-3);

  }

}


# 打字水果遊戲

6. 下載音樂

1. 開啟 https://www.typing.com/dist/student/extras/game_files/keyboard-ninja/app.min.446.js 這個網頁(moodle第2個連結),Ctrl+F 找 mp3


2. 再開啟 https://www.typing.com/dist/student/extras/game_files/keyboard-ninja/sounds/Intro%20Song_Final.mp3 這個網頁(moodle第3個連結)


3. ---> 修改紅框框內的字 可下載別的mp3, ex: In Game Music、Monkey 1...


7-1. 加上音樂功能-1

//存檔,mp3拉進來,Ctrl-K看檔案

import processing.sound.*; ///音樂功能

///使用外掛, 裝音樂外掛!


void setup(){

  Sound s = new Sound(this);   ////這邊有問題,要加外掛!!! ...... 7-2

}

void draw(){

  

}

void mousePressed(){


}

- 需要 在程式儲存的資料夾 新增 data資料夾 將mp3檔放進data資料夾



7-2. 加上音樂的外掛

1. (上) Sketch / 函式庫 / Manager

2. 找 Sound   / 第6個下載


8. 加上音樂功能-2

//存檔,mp3拉進來,Ctrl-K看檔案

import processing.sound.*; ///音樂功能

///使用外掛, 裝音樂外掛!


void setup(){  ///程式跑起來,播第一個聲音

  SoundFile file = new SoundFile(this, "Intro Song_Final.mp3");

  file.play();

}

void draw(){

  

}

void mousePressed(){ ///點擊滑鼠,播第二個聲音(會與第一個聲音重疊一起)

  SoundFile file2 = new SoundFile(this, "In Game Music.mp3");

  file2.play();

}


9. 一次讀很多檔案(mp3)

//存檔,mp3拉進來,Ctrl-K看檔案

import processing.sound.*; ///音樂功能

///使用外掛, 裝音樂外掛!

///Sketch-library-manage,找sound 下載第6個  (7-2)


SoundFile file1, file2, file3, file4; ///不用一直重複讀檔

void setup(){

  file1 = new SoundFile(this,"Intro Song_Final.mp3");

  file2 = new SoundFile(this,"In Game Music.mp3");

  file3 = new SoundFile(this,"Monkey 1.mp3");

  file4 = new SoundFile(this,"Monkey 2.mp3");

  

  file1.play(); ///程式執行,播放第1個mp3(播一次而已)

}

void draw(){

  

}

void mousePressed(){   ///點滑鼠,播放第2個mp3

  file2.play();

}

void keyPressed(){   ///按鍵盤任意鍵,播放第3個mp3

  file3.play();

}





沒有留言:

張貼留言