我一直在研究一个简单的html5画布游戏,我正在尝试为设备添加触摸控件以及桌面键盘输入等 . 键盘控制非常完美:空格键可以跳跃,并保持更长时间跳 . 我已经添加了用于触摸控制的事件监听器,它模拟了空格键的单击,但是我无法弄清楚如何使用触摸控件重新创建空格键以获得更长的跳跃 . 我的键盘代码如下所示:
// jump if not currently jumping or falling
if (KEY_STATUS.space && player.dy === 0 && !player.isJumping) {
player.isJumping = true;
assetLoader.sounds.jump.play();
player.dy = player.jumpDy;
jumpCounter = 12;
}
// jump higher if the space bar is continually pressed
if (KEY_STATUS.space && jumpCounter) {
player.dy = player.jumpDy;
assetLoader.sounds.jump.play();
}
jumpCounter = Math.max(jumpCounter-1, 0);
this.advance();
并使用此代码跟踪:
var KEY_CODES = {
32: 'space'
};
var KEY_STATUS = {};
for (var code in KEY_CODES) {
if (KEY_CODES.hasOwnProperty(code)) {
KEY_STATUS[KEY_CODES[code]] = false;
}
}
document.onkeydown = function(e) {
var keyCode = (e.keyCode) ? e.keyCode : e.charCode;
if (KEY_CODES[keyCode]) {
e.preventDefault();
KEY_STATUS[KEY_CODES[keyCode]] = true;
}
};
document.onkeyup = function(e) {
var keyCode = (e.keyCode) ? e.keyCode : e.charCode;
if (KEY_CODES[keyCode]) {
e.preventDefault();
KEY_STATUS[KEY_CODES[keyCode]] = false;
}
};
我的触摸屏设备新事件监听器如下所示:
document.addEventListener("touchstart", touchHandler);
document.addEventListener("touchhold", touchHandler);
document.addEventListener("touchend", touchHandler);
然后我有这个功能,它或多或少与键盘输入功能相同,只引用'e.touches',而不是'KEY_STATUS':
function touchHandler(e) {
if(e.touches && player.dy === 0 && !player.isJumping) {
player.isJumping = true;
assetLoader.sounds.jump.play();
player.dy = player.jumpDy;
jumpCounter = 12;
e.preventDefault();
}
}
该功能可实现小跳跃 . 如果我包含这个'if'语句,它会启用多次跳转:
if (e.touches && jumpCounter) {
player.dy = player.jumpDy;
assetLoader.sounds.jump.play();
}
...而不是让玩家执行更长的跳跃 . 从本质上讲,玩家可以在整个游戏中轻拍,我不想要!有没有办法在'touchHandler()'函数中指定正在进行哪种跳转,即 . 屏幕被点击或保持?或者我需要为此编写一个单独的函数?提前致谢 .