在這一教程序列中,我們將學習如何創造出像經典的《空間防禦》這樣的太空射擊遊戲。

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的故事板功能,如何開始我們的應用,以及如何創造一個菜單係統了。