一、鍵盤(pán)交互相關(guān)關(guān)鍵詞與函數(shù)
keyIsPressed: 關(guān)鍵詞,按下按鍵時(shí)為true,反之為false
keyCode: 關(guān)鍵詞,用于判斷按下哪個(gè)按鍵
keyPressed():函數(shù),按鍵按下時(shí)觸發(fā)一次
keyReleased():函數(shù),按鍵松開(kāi)時(shí)觸發(fā)一次
keyIsDown():函數(shù),按下指定按鍵時(shí)返回true,反之為false
以下是一個(gè)較綜合的案例,用wsad與zxcv控制小球移動(dòng):
var x=200; var y=200; var speed=2; function setup() { createCanvas(400, 400); } function draw() { background(220); ellipse(x,y,20,20); if(keyIsPressed){ //持續(xù)觸發(fā) //字母用小寫(xiě) if(key=='a'){ x-=speed; } if(key=='d'){ x+=speed; } } if(keyIsDown(87)){ //持續(xù)觸發(fā) //使用keyCode //87即w y-=speed; } if(keyIsDown(83)){ //持續(xù)觸發(fā) //使用keyCode //83即s y+=speed; } } function keyPressed(){ //按鍵按下時(shí)觸發(fā)一次 //字母用大寫(xiě) if(key=='Z'){ x-=20; } if(key=='X'){ x+=20; } } function keyReleased(){ //按鍵松開(kāi)時(shí)觸發(fā)一次 //字母用大寫(xiě) if(key=='C'){ y-=20; } if(key=='V'){ y+=20; } }
查看效果:http://alpha.editor.p5js.org/full/S1YQvEFIZ
二、key與keyCode
下面這個(gè)案例將在畫(huà)面上輸出你按下的按鍵的key與keyCode,在寫(xiě)程序時(shí)可以用這個(gè)辦法快速查找keyCode:
function setup() { createCanvas(400, 400); } function draw() { background(220); textAlign(CENTER); textSize(30); if(keyIsPressed){ text(key,200,180); text(keyCode,200,220); } }
相信看了本文案例你已經(jīng)掌握了方法,更多精彩請(qǐng)關(guān)注Gxl網(wǎng)其它相關(guān)文章!
推薦閱讀:
vue-cli+webpack創(chuàng)建項(xiàng)目報(bào)錯(cuò)
jquery fullpage插件如何操作頭部與尾部
聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com