跳到主要内容

构建iPhone街机游戏

  • 软件:ActionScript 3.0和Google Static Map API
  • 项目时间:2小时
  • 技能:掌握ActionScript 3.0,使用Google Static Map API,将Adobe AIR集成到您的工作中

下载支持文件

客户并不总是选择自己喜欢的概念 - 但这并不意味着您应该忘记这些想法。我们最近向一家大型时装公司提出了一个伟大的概念:他们喜欢它,但又选择了另一种选择,给我们留下了一个我们喜欢的想法,但在开发方面却没有下一步。本教程是关于将一个想法转变为一个有用的概念并将其转化为有形的东西 - 在这种情况下,一个应用程序。

Beanie和Balloonist是一款真实的街机游戏,它可以连接到Google地图,通过GPS坐标定位您的位置,并将该区域转换为您的游戏地图。您可以通过在现实世界中移动来控制游戏。

首先,我们发明了一个故事情节:一个有使命感的英雄。最初这是在街道上捡钱币,同时被追逐。我们讨论了不同的角色选择,找到了一个有趣的幻想英雄:Beanie--世界上最大的海军豆。气球运动员是他高飞,烧豆爱的克星。在本教程中,我们将介绍概念和角色开发,以及如何使用ActionScript 3.0,Google Static Map API和土砖AIR For Mobile开发。

第01步

首先,草拟你的字符和概念的想法。我们喜欢我们的坏人飞来飞去的想法 - 毕竟他需要能够穿越水和其他障碍物。同样重要的是,他的飞机不是太快,玩家很容易击落。当我们绘制第一幅素描时,我们几乎可以听到气球派的诡计。

第02步

考虑角色的功能,并相应地设计它们。 Beanie是The Ballonist痴迷食物幻想的产物。从概念上讲,他最终成为这种50年代风格的长臂和长腿豆,因为他最重要的任务就是跑来跑去。我们最初的概念中的硬币变成了尖锐的物体:图钉,飞镖和叉子 - 这些都是穿刺气球飞机的完美之选。

第03步

还要考虑用户在哪里玩游戏。在现实世界中,Beanie和Balloonist将在室外播放,因此我们选择了黑白调色板来与用户丰富多彩的环境进行对比。通常我们自己绘制所有角色,但这个个人项目允许我们与阿根廷人合作插画Martin Cocchi,我们一直想与之合作。我们用粗略的草图和角色简介联系了他。

第04步

在初步草稿和我们团队的一些小反馈之后,马丁画了两张完整的角色。游戏界面非常简单,仅基于两个角色和一组锐利物体。

第05步

在游戏中,我们为玩家在地图上画了一张地图,选择了简单的黑白风格,并在没有道路的地方随机摆放了一些“豆豆式”树木和山脉。

第06步

由于我们的预算很少,我们在朋友和家人中寻找我们角色的声音。 Hello Monday的一位妻子有一个完美的豆豆声音,一位朋友做了一个很棒的苏格兰模仿。如果你需要声音和钱很紧,只需抓住你的朋友,租一个工作室一小时。

第07步

我们的游戏是使用Adobe制作的Builder 4.5,但您可以使用自己喜欢的IDE进行操作。首先创建一个新的ActionScript移动AIR项目。这将创建一个文档类和一个应用程序描述符XML文件。您可以找到有关此内容的更多信息这里

第08步

添加精灵以显示玩家在地图上的位置。这可以是从动画角色到更简单的东西,如小红圈,就像在这种情况下一样。

第09步

要访问移动设备的内置GPS,您需要添加Geolocation类的实例。首先检查您的设备是否支持Geolocation。接下来,通过setRequestedUpdateInterval()方法调整您希望从GPS接收更新信息的频率 - 我们选择每100毫秒更新一次。如果未指定更新间隔,它将使用设备的默认值,具体取决于型号。寻找平衡非常重要,因为它更新的越多,它消耗的电池电量就越多。

第10步

在更新处理程序中,我们需要从GPS检索一些信息。首先,我们获得我们的位置,我们以经度和纬度坐标的形式获得。为了确保我们的位置不会显示得太不准确,我们会在读数准确到12米范围内时检索地图,这是我们此处准确性的基准。

第11步

我们计算地图的左上角,稍后将用于计算玩家的位置(以像素为单位)。接下来,我们向Google Static Maps API发出请求。您可以通过向http://maps.google apis.com/maps/api/staticmap发出HTTP请求来执行此操作吗?后跟一串连接参数,它们将返回指定缩放级别和尺寸的图像(最大尺寸限制为512x512像素)。我们提供的纬度和经度将是地图的中心。当您不使用标记时,您需要指定中心和缩放级别 -更多关于这里

第12步

当地图准备好后,我们将它添加到舞台并开始更新角色的位置(我们的红色圆圈)。

第13步

要在地图周围移动角色,我们需要将纬度和经度转换为像素。首先,我们计算纬度/经度值到左上角的距离。接下来,我们将此值转换为像素。我们必须计算一个像素在给定缩放级别的纬度/经度值中的多少,这是通过将地图宽度/高度除以从西到东和从北到南的距离(纬度/经度)来完成的 - 我们有硬编码此值,但您可以通过添加更多API调用为此创建更动态的方法。请记住,更多的通话意味着更多的处理。当我们有这个数字时,很容易通过将距离除以一个像素值来获得像素的位置。就是这样,你已经完成了。

喜欢这个?阅读这些!



翻译字数超限