在这一教程序列中,我们将学习如何创造出像经典的《空间防御》这样的太空射击游戏。
Space Defender
系列概述 在这一版本的《空间防御》中,玩家将通过射击敌人保卫自己的空间。每当玩家成功消灭一个敌人时,他们便会获得分数点,而当玩家拥有了20或40个分数点时,他们的枪支便能升级。游戏还会发送价值5个点数的奖励包。既然对这款游戏有了初步了解,我们便可以开始创造了。
我们将使用Corona SDK创造这一太空射击游戏。以下是在这系列教程中会出现的内容:
快速介绍Corona的故事板
如何在创作功用授权下使用原图
如何使用自定义字体
如何使用像按键等小工具
如何使用Corona SDK创造一款完整的游戏
你需要什么 为了使用这一教程,你需要在自己的计算机上安装Corona SDK。如果你没有SDK,前往www.CoronaLabs.com创造一个免费的帐号并下载免费的软件。
1.创造配置 我们设置游戏的第一步便是创造一个build.settings文件。这一文件将处理我们应用中的所有创造时间属性,如面向Android和iOS平台的定位以及额外选择。创造一个名为build.settings的新文件,复制以下设置到这一文件中。
settings = {
orientation = {
default = “landscapeRight”,
supported = { “landscapeRight”, “landscapeLeft”}
},
iphone = {
plist = {
UIStatusBarHidden = false,
UIAppFonts = { “Kemco Pixel.ttf” },
}
},
}
关于Corona SDK最棒的一点便是语言自文档化以及文件中大多数的设置都很容易理解。让我们快速浏览这些设置。
定位—-这一表格储存了游戏的真正外观。在我们的情况中,我们希望游戏是基于横向方式,并同时支持左右视角。
UIStatusBarHidden—-当我们在玩自己的游戏时,我们想要隐藏状态栏。所以我们将该选择设置为默认。
UIAppFonts—-这一选择让我们能够在应用中使用自定义字体,因为我们想要在应用中使用Kemco Pixel.ttf,所以我们便在此进行设置。字体文件必须放置在你的项目的根文件夹中。我们能在http://www.dafont.com/kemco-pixel.font中下载到Kemco Pixel。
2.运行时间配置 当我们设置了创造时间配置后,我们将在config.lua文件中设置运行时间配置。在这一文件中,我们将设置游戏的宽度和高度,内容规范的类型以及每秒的帧率。创造一个名为config.lua的新文件并复制如下设置。
application = {
content = {
width = 320,
height = 480,
scale = “letterBox”,
fps = 30,
},
}
与我们的build.settings文件一样的是,config.lua也是自文档化,除了规模选择外。规模选择是Corona SDK用于调整你的应用去面对不同屏幕尺寸的功能。在letterBox选择中,我们让Corona在保持纵横比的同时在屏幕上呈现所有的内容。当内容未能覆盖整个屏幕时,应用将在该区域呈现不带有任何内容的黑栏(就像基于宽屏的电影一样)。
在我们继续创造自己的应用前,我们需要说说图像。我们可以通过许多不同的方式将图像整合到游戏中,如聘请图像设计师,寻求朋友的帮助,独自绘制,或从http://graphicriver.net/等网站上购买相关图像。
然而,如果你的经费有限,你便不能购买这些图像,或者你可能也没时间去创造它们。在这种情况下,你可以使用基于创作共用授权而发行的图像。这些创作共用授权让你能够基于一些限制条件(如告知作者归因)而免费使用图像。
对于我们的游戏,我们将基于创作共用授权使用来自OpenGameArt.org的图像。这些图像的创造者是VividRealtiy,这是其作品的链接—-http://opengameart.org/content/evolutius-gfx-pack。在继续之前,请先确保你下载了图像设置或有关该教程的文件。
尽管还有许多基于该授权的图像网站,我经常访问的网站有三个:
http://www.graphic-buffet.com/freebies/
http://creativity103.com
http://thatssopanda.com/blog/game-assets-for-corona-sdk
3.故事板设置 既然我们已经拥有了图像,我们便可以继续创造游戏了!为此我们需要创造一个名为main.lua的新文件。该文件将是我们游戏的起点,实际上它也是每款基于Corona的游戏的起点。一旦创造了文件,你可以在自己喜欢的编辑器上打开它,并输入如下代码:
– hide the status bar
display.setStatusBar( display.HiddenStatusBar )
这行代码将在iOS上隐藏状态栏。接下来我们将使用Corona的故事板功能去管理我们的游戏。故事板功能将突出游戏的两个部分作为场景,从而让开发者可以更轻松地管理代码。举个例子来说吧,我们的游戏拥有三个场景—-main.lua,菜单以及游戏屏幕。一旦设置了每个场景,Corona将提供一种简单的方式在不同场景间移动着。因为这对于那些刚开始使用Corona SDK的开发者而言可能是个巨大的障碍,所以我将呈现出我们游戏布局的图像解释:
每个蓝色框代表一个独立场景,而每个场景间的箭头呈现的是我们如何穿越场景。简单地来说,我们是从main.lua开始,并会在场景2和场景3之间来回移动。
在我们的应用中执行故事板非常简单:只需要模块便可,而你也已经准备就绪了!将以下代码放置在main.lua去整合这一伟大的功能。
– include the Corona “storyboard” module
local storyboard = require “storyboard”
接下来我们将要移动到第二个场景,我们将使用故事板变量去完成它。
– load menu screen
storyboard.gotoScene( “menu” )
现在我们便完成了main.lua文件,让我们开始处理主菜单!
4.主菜单创造 我们游戏的主菜单将呈现背景图像,游戏名称以及开始游戏按键。一开始让我们先创造名为menu.lua的新文件和Corona所突出的故事板。
local storyboard = require( “storyboard” )
local scene = storyboard.newScene()
现在我们将添加Corona的小部件功能去创造按键。小部件功能让我们能够轻松地创造像游戏中的按键等常见的GUI元素。
local widget = require “widget”
在浏览了部件库之后,我们将为游戏预先定义一些变量。这些变量将储存屏幕狂赌,高度以及屏幕中标轴的中点。
local screenW, screenH, halfW, halfY = display.contentWidth, display.contentHeight, display.contentWidth*0.5, display.contentHeight*0.5
在设置了变量之后,我们将创造名为scene:createScene()的第一个函数。这一函数会在场景首次加载或者场景在之前被删除时进行调用。一般说来,这一函数是用于添加所有图像元素到屏幕上。
function scene:createScene( event )
local group = self.view
end
故事板的一个重要功能便是处理对象的方式。所有呈现我们在这一场景中使用的对象都将被放置在变量群组中。通过在这一群租中放置我们的对象,我们便能让Corona知道这些对象属于这一场景,而当需要删除场景时,这些对象也会被删除。
在函数scene:createScene()中,我们将使用图像BKG.png(注:该图像是来自opengameart.org)作为游戏的背景图像。当添加了该图像后,我们将把它陈列在屏幕的中间,并将其整合到群组变量中。
– display a background image
local bg = display.newImageRect(“images/BKG.png”, 480, 320)
bg.x = halfW
bg.y = halfY
group:insert(bg)
接下来我们将使用自定义字体(我们在build.settings文件中所指定的)把游戏名字放置在屏幕上。
– place a game title on the screen
local gametitle = display.newText(“Space Defender”,0,0,”Kemco Pixel”,40)
gametitle.x = halfW
gametitle.y = 100
group:insert( gametitle )
最后添加到第一个函数中的便是游戏按键。游戏按键将使用Corona的小部件功能以及一个名为onPlayBtnRelease的事件侦听器。当用户碰触到游戏按键时,事件侦听器将被触发。以下代码都是在scene:createScene()函数中。
local function onPlayBtnRelease()
storyboard.gotoScene( “game”, “slideLeft”)
end
playBtn = widget.newButton{
label=”Play Now”,
labelColor = { default={255} },
defaultFile = “images/Button.png”, overFile = “images/Button_Purple.png”,
width=150, height=60, left=180, top=150,
font = “Kemco Pixel”,
fontSize = 18, onRelease = onPlayBtnRelease — event listener function
}
group:insert( playBtn )
在创造了场景函数后,我们将添加一个进入场景函数。该函数将在创造场景函数之后被触发,并删除之前的场景。
function scene:enterScene( event )
local group = self.view
if storyboard.getPrevious() ~= nil then
storyboard.removeScene(storyboard.getPrevious())
end
end
我们将添加的最后函数便是destroyScene函数。该函数将在场景被删除或被破坏时被调用。在我们的例子中,因为我们正在使用小部件,而小部件需要手动删除,所以我们将在破坏场景函数中删除小部件。
function scene:destroyScene( event )
local group = self.view
if playBtn then
playBtn:removeSelf() — widgets must be manually removed
playBtn = nil
end
end
最后,我们将添加事件侦听器去调用我们所设置的不同函数—-enterScene,destroyScene以及createScene。
scene:addEventListener( “createScene”, scene ) scene:addEventListener( “enterScene”, scene ) scene:addEventListener( “destroyScene”, scene )
结论 这便是本系列教程的第一部分!我们已经学会了如何设置项目,如何执行Corona的故事板功能,如何开始我们的应用,以及如何创造一个菜单系统了。