使用JavaScript创建一个简单的Windows 8游戏: 第 4部分- 输入&声音

分享于 

6分钟阅读

Web开发

  繁體

在10天内开发 Windows 8应用程序。

创建一个简单的Windows 8游戏系列:

这是一系列文章中的第四篇,将展示如何创建( 非常) 简单 Windows 8游戏。 我们将使用 HTML5.JavaScript。WinJS和一些从 CreateJS的有用库。

游戏是基于XNA样本游戏 "catapult war实验室"。 我们将在开发基于web技术的Windows 8的新版本时重用这个游戏的资产。

在这篇文章中,我们将对用户输入做出响应,并添加声音来使事情更加生动。

处理用户输入

当然,我们可以有很多方法,即随机。时间。精度( 比如 )。 "点击。"。"。现在"),但在这种情况下,我们会让用户画出 direction 和速度。

首先,让我们在 default.js的顶部添加新变量:

Windows 8支持几种绘制- 鼠标,触摸,笔,我们的游戏需要灵活,以支持任何用户。 幸好,MSPointer 系统将对所有这些的支持组合成一个。 我们将使用 MSPointerDown/up开始和结束,以及MSPointerMove在用户调整目标时提供反馈。

顺便说一下,通过MSGesture也可以很好的支持手势,比如点击,双击,等等 一个很好的处理输入和手势的例子就是在MSDN上的"ballineight"示例插件。

这些事件是通过指向侦听器函数来使用的,当它们。 现在让我们注意一下,添加接近 initialize() 函数的顶部:

下面是函数本身( 添加到你喜欢的位置,但我放在 update()fireShot() 之间:

注意在这里留下一个练习。 为了简单起见,我省略了在 adjustAim() 函数中显示带有 aim % 和/或者绘制瞄准箭头的文本。 继续尝试添加- 从早期的部分中,我们已经使用了相同的技术,你将需要。

还有一个帮助我们计算目标的函数:

同样,简单规则一天,这只是为玩家 1,但这是发生的事情:

  • 从起点到终点的距离为 Create Points点Points点点Points点。 将它的缩小到一个好的速度以应用每帧/更新。
  • 收费 & - 确保x 和y limited在屏幕上disappear消失,
  • 收费 & - 确保shot向敌人。 或多或少。

我们之前给 update() 添加了一些临时代码,玩家 1总是随机触发。 现在我们可以替换它以使用新的aimVector:

继续运行游戏。

现在你可以使用鼠标。笔或者触摸来控制镜头 !

"我必须听到一些东西"- 添加声音 !

我们做游戏的工作只有在有了声音的时候才能完成。 我们已经在第部分中添加了声音文件 ,所以让我们通过加载它们来执行下一步。

首先,在 default.js 中,一些变量可以保持整洁:

回忆第 2部分,我们已经连接了 PreloadJS,以确保在游戏开始时我们的资源已经就绪? 我们可以使用与声音相同的方法,因此让我们将它们添加到 Manifest:

要使用这些文件,我们将创建HTML音频元素的实例。 长故事,如果每个声音文件只创建一个音频实例,可能会在实例之前播放。 有几种处理( 例如请参见 "的音频和JavaScript控制" )的方法,但我们每次播放声音时都会使用一个简单的&'低效率'事件。

在本例中,我们不会使用 SoundJS,但是当然,你也可以使用它来进行旋转

添加 playSound(file) helper 函数:

就是这样现在我们只调用它,指定指向正确文件的常量。 我们将在几个地方做这个。

首先,添加对 fireShot()的调用:

现在,processHit():

如评论所述,如果你想要使用多次击击来销毁"命中",你可以使用声音而不是"爆炸"。

和 finally,在 endGame() 中播放结束或者丢失声音:

继续,让它运行,尝试一下。

游戏开始。继续。 然后。

恭喜你你做了一个游戏 !

我们已经在这篇文章中介绍了很多内容,但像任何东西一样,还有其他一些事情要尝试。 为什么不给他们点颜色看看?

  • 屏幕调整- portrait/landscape,snap/填充。 了解CSS媒体查询的绝佳机会 !
  • 改进触摸/手势支持
  • sprite/动画- 命中/脱靶,鱼叉反冲/射击,catapult被摧毁
  • 游戏动态- 增加风,新场景,新的弹射特性/升级,弹药的选择等。
  • 向 background ( 资产已经存在) 添加山体和移动云
  • 将一些'智能化'添加到当前的'人工'智能中
  • 考虑使用动态瓦片- 也许显示玩家得分的最后/高?
  • 点击 Download Catapult游戏扩展套件并解决其中一些想法- 健康酒吧,2人的角度,瞄准,瞄准,supplies和滚动的scrolling。

尽情享受期待你添加的精彩新东西 !


相关文章