小凱 Week09

第一節課

為了解決打字太慢的問題，今天試著做有關鍵盤的程式。

week09-1

PImage img;
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
}
void draw(){
 image(img,0,600-266); 
}

week09-2

加上滑鼠用框框選取按鍵，再加上淡黃色清背景，最後用mousePressed去定位跟印出mouse座標。

PImage img;
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(255,0,0,128);//半透明的紅色
 rect(mouseX,mouseY,28,30,5);
}
void mousePressed(){
 println(mouseX,mouseY);//定位、印出滑鼠座標 
}

week09-3

用框框紀錄a到z的座標，把座標放到notepad++改成陣列型態(把空格取代成逗號，跳行改成大括號)。在程式用int宣告陣列，把座標放進來。

PImage img;
int [][]pos={{92,491},{244,524},{178,524},{160,491},{150,457},{197,490},{228,489},{261,488},{323,455},{296,487},{332,491},{365,489},{315,523},{280,524},{354,456},{390,455},{86,455},{184,455},{127,489},{219,456},{289,456},{212,521},{118,455},{141,523},{254,456},{111,525}};
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(0,255,0,128);//半透明的紅色
 for(int i=0;i<26;i++){
 rect(pos[i][0],pos[i][1],28,30,5);
 }
}
void mousePressed(){
 println(mouseX,mouseY);//定位、印出滑鼠座標 
}

第二節課

week09-4

鍵盤輸入會用顯示顏色(按k鍵，k鍵會顯示綠色)。

PImage img;
int [][]pos={{92,491},{244,524},{178,524},{160,491},{150,457},{197,490},{228,489},{261,488},{323,455},{296,487},{332,491},{365,489},{315,523},{280,524},{354,456},{390,455},{86,455},{184,455},{127,489},{219,456},{289,456},{212,521},{118,455},{141,523},{254,456},{111,525}};
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(0,255,0,128);//半透明的紅色
 for(int i=0;i<26;i++){
   if(pressed[i]) rect(pos[i][0],pos[i][1],28,30,5);
 }
}
boolean[]pressed=new boolean[26];
void keyPressed(){
 if(key>='a'&&key<='z') pressed[key-'a']=true; 
}
void keyReleased(){
 if(key>='a'&&key<='z') pressed[key-'a']=false; 
}

week09-5

在打字區秀出鍵盤上打的字母，還不能打字(只有秀出來，數值設定好的)。

PImage img;
int [][]pos={{92,491},{244,524},{178,524},{160,491},{150,457},{197,490},{228,489},{261,488},{323,455},{296,487},{332,491},{365,489},{315,523},{280,524},{354,456},{390,455},{86,455},{184,455},{127,489},{219,456},{289,456},{212,521},{118,455},{141,523},{254,456},{111,525}};
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(0,255,0,128);//半透明的紅色
 for(int i=0;i<26;i++){
   if(typing.charAt(0)-'a'==i) rect(pos[i][0],pos[i][1],28,30,5);
   if(pressed[i]) rect(pos[i][0],pos[i][1],28,30,5);
 }
 fill(0);
 textSize(50);
 text(typing,50,50);
 text(typing.charAt(0),50,100);//現在要打的字
}
String typing="printf";
boolean[]pressed=new boolean[26];
void keyPressed(){
 if(key>='a'&&key<='z') pressed[key-'a']=true; 
}
void keyReleased(){
 if(key>='a'&&key<='z') pressed[key-'a']=false; 
}

week09-6

鍵盤打字會秀在上面，紅色顯示要打的字母，黑色顯示打好的字母(目前沒有判斷正確的功能)。

PImage img;
int [][]pos={{92,491},{244,524},{178,524},{160,491},{150,457},{197,490},{228,489},{261,488},{323,455},{296,487},{332,491},{365,489},{315,523},{280,524},{354,456},{390,455},{86,455},{184,455},{127,489},{219,456},{289,456},{212,521},{118,455},{141,523},{254,456},{111,525}};
void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(0,255,0,128);//半透明的紅色
 for(int i=0;i<26;i++){
   if(typing.charAt(ID)-'a'==i) rect(pos[i][0],pos[i][1],28,30,5);
   if(pressed[i]) rect(pos[i][0],pos[i][1],28,30,5);
 }
 fill(0);
 textSize(50);
 text(typing,50,50);//要打的字
 fill(255,0,0);
 text(typed+typing.charAt(ID),50,100);
 fill(0);
 text(typed,50,100);//已經打好的字
}
String typing="printfprintfprintf";
String typed="";//一開始打了0個字
int ID=0;
boolean[]pressed=new boolean[26];
void keyPressed(){
 if(key>='a'&&key<='z'){
   pressed[key-'a']=true; 
   typed+=key;
   ID++;
 }
}
void keyReleased(){
 if(key>='a'&&key<='z') pressed[key-'a']=false; 
}

第三節課

week09-7

接著判斷字母對錯，對的打出來，錯的不會打出來且螢幕會閃紅色。

目前問題:打超過字數會當機。

week09-8

判斷打完結束

week09-9

加上判斷有空白鍵。

PImage img;
int [][]pos={{92,491},{244,524},{178,524},{160,491},{150,457},{197,490},{228,489},{261,488},{323,455},{296,487},{332,491},{365,489},{315,523},{280,524},{354,456},{390,455},{86,455},{184,455},{127,489},{219,456},{289,456},{212,521},{118,455},{141,523},{254,456},{111,525}};

void setup(){
 size(800,600); 
 img=loadImage("keyboard.png");
 rectMode(CENTER);//用中心點來畫四邊形
}
void draw(){
  background(#FFFFF2);//淡黃色，清背景
 image(img,0,600-266); 
 fill(0,255,0,128);//半透明的紅色
 for(int i=0;i<26;i++){
   if(ID<typing.length()&&typing.charAt(ID)-'a'==i) rect(pos[i][0],pos[i][1],28,30,5);
   if(pressed[i]) rect(pos[i][0],pos[i][1],28,30,5);
 }
 fill(0);
 textSize(50);
 text(typing,50,50);//要打的字
 fill(255,0,0);
 if(ID<typing.length()) text(typed+typing.charAt(ID),50,100);
 fill(0);
 text(typed,50,100);//已經打好的字
}
String typing="printf is a function";
String typed="";//一開始打的個字
int ID=0;
boolean[]pressed=new boolean[26];
void keyPressed(){
if(ID<typing.length()&&key==typing.charAt(ID)){
  if(key>='a'&&key<='z'){
   pressed[key-'a']=true; 
   typed+=key;
   ID++;
  }else if(key==' '){
    typed+=key;
    ID++;
  }
   }else{
     background(255,0,0);
 }
}
void keyReleased(){
 if(key>='a'&&key<='z') pressed[key-'a']=false; 
}