Corona SDK游戲開發(fā)實例（二）：物理效果與互動操作
譯文作者：核子可樂 譯
在本系列指導(dǎo)教程中，我們共同來學(xué)習(xí)如何創(chuàng)建一款平衡球類游戲。這款游戲的目標(biāo)是保持小球平衡、避開各種障礙物并最終到達(dá)終點。簡單的小游戲，咱們馬上進(jìn)入正題！
教程說明
- 技術(shù)工具: Corona SDK
- 執(zhí)行難度: 普通
- 操作時間: 30 到60分鐘
書接上文
在本系列文章的前編中，我們了解了平衡球小游戲的基本概念并創(chuàng)建出基礎(chǔ)用戶界面。在后編中，我們將共同完成基礎(chǔ)物理效果創(chuàng)建、游戲互動性編寫等工作，并最終制作出能夠給用戶帶來樂趣的應(yīng)用成品。
步驟二十九: 添加物理效果
為游戲中的各個圖形元素分配物理屬性，要注意靜態(tài)元素是不能移動的。另外還要檢查玩家操控的小球與陷阱洞的半徑，這些元素必須聲明使用圓形物理屬性而不能用一般的方形，這樣會提高物理碰撞效果、提高游戲性。
- -- Add Physics to GFX
- physics.addBody(left, 'static')
- physics.addBody(right, 'static')
- physics.addBody(top, 'static')
- physics.addBody(bottom, 'static')
- physics.addBody(b1, 'static')
- physics.addBody(b2, 'static')
- physics.addBody(b3, 'static')
- physics.addBody(b4, 'static')
- physics.addBody(h1, 'static', {radius = 15})
- physics.addBody(h2, 'static', {radius = 15})
- physics.addBody(h3, 'static', {radius = 15})
- physics.addBody(h4, 'static', {radius = 15})
- physics.addBody(h5, 'static', {radius = 15})
- physics.addBody(player, {radius = 14})
- physics.addBody(goal, 'static', {radius = 15})
步驟三十: 將陷阱小洞設(shè)置為感應(yīng)器
由于作為陷阱的小洞本身不會產(chǎn)生物理碰撞效果，因此我們只要為其設(shè)置接觸感應(yīng)器即可。
- -- Set Holes as Sensors
- h1.isSensor = true
- h2.isSensor = true
- h3.isSensor = true
- h4.isSensor = true
- h5.isSensor = true
- --gameListeners('add')
- end
步驟三十一: 代碼審查
以下列出的是本教程所提到全部代碼綱要，大家可以從宏觀角度對作品進(jìn)行核查，確定所有要素都已經(jīng)包含在程序成品當(dāng)中：
- -- Teeter like Game
- -- Developed by Carlos Yanez
- -- Hide Status Bar
- display.setStatusBar(display.HiddenStatusBar)
- -- Physics
- local physics = require('physics')
- physics.start()
- physics.setGravity(0, 0)
- -- Graphics
- -- [Background]
- local bg = display.newImage('bg.png')
- -- [Title View]
- local titleBg
- local playBtn
- local creditsBtn
- local titleView
- -- [Credits]
- local creditsView
- -- [Player]
- local player
- -- [Bars Table]
- local bars = {}
- -- [Holes Table]
- local holes = {}
- -- [Goal]
- local goal
- -- Sounds
- local bell = audio.loadSound('bell.caf')
- local buzz = audio.loadSound('buzz.caf')
- -- Functions
- local Main = {}
- local startButtonListeners = {}
- local showCredits = {}
- local hideCredits = {}
- local showGameView = {}
- local gameListeners = {}
- local movePlayer = {}
- local onCollision = {}
- local alert = {}
- local dragPaddle = {}
- -- Main Function
- function Main()
- titleBg = display.newImage('titleBg.png')
- playBtn = display.newImage('playBtn.png', display.contentCenterX - 35.5, display.contentCenterY + 10)
- creditsBtn = display.newImage('creditsBtn.png', display.contentCenterX - 50.5, display.contentCenterY + 65)
- titleView = display.newGroup(titleBg, playBtn, creditsBtn)
- startButtonListeners('add')
- end
- function startButtonListeners(action)
- if(action == 'add') then
- playBtn:addEventListener('tap', showGameView)
- creditsBtn:addEventListener('tap', showCredits)
- else
- playBtn:removeEventListener('tap', showGameView)
- creditsBtn:removeEventListener('tap', showCredits)
- end
- end
- function showCredits:tap(e)
- playBtn.isVisible = false
- creditsBtn.isVisible = false
- creditsView = display.newImage('credits.png', 0, display.contentHeight+40)
- transition.to(creditsView, {time = 300, y = display.contentHeight-20, onComplete = function() creditsView:addEventListener('tap', hideCredits) end})
- end
- function hideCredits:tap(e)
- playBtn.isVisible = true
- creditsBtn.isVisible = true
- transition.to(creditsView, {time = 300, y = display.contentHeight+creditsView.height, onComplete = function() creditsView:removeEventListener('tap', hideCredits) display.remove(creditsView) creditsView = nil end})
- end
- function showGameView:tap(e)
- transition.to(titleView, {time = 300, x = -titleView.height, onComplete = function() startButtonListeners('rmv') display.remove(titleView) titleView = nil end})
- -- [Add GFX]
- -- Goal
- goal = display.newImage('goal.png')
- goal.x = 439
- goal.y = 31
- goal.name = 'g'
- -- Walls
- local left = display.newLine(-1, 0, -1, display.contentHeight)
- local right = display.newLine(display.contentWidth+1, 0, display.contentWidth+1, display.contentHeight)
- local top = display.newLine(0, -3, display.contentWidth, -3)
- local bottom = display.newLine(0, display.contentHeight, display.contentWidth, display.contentHeight)
- -- Bars
- local b1 = display.newImage('bar.png', 92, 67)
- local b2 = display.newImage('bar.png', 192, -2)
- local b3 = display.newImage('bar.png', 287, 67)
- local b4 = display.newImage('bar.png', 387, -2)
- -- Holes
- local h1 = display.newImage('hole.png', 62, 76)
- local h2 = display.newImage('hole.png', 124, 284)
- local h3 = display.newImage('hole.png', 223, 224)
- local h4 = display.newImage('hole.png', 356, 114)
- local h5 = display.newImage('hole.png', 380, 256)
- h1.name = 'h'
- h2.name = 'h'
- h3.name = 'h'
- h4.name = 'h'
- h5.name = 'h'
- -- Player
- player = display.newImage('player.png')
- player.x = 49
- player.y = 288
- player:setReferencePoint(display.CenterReferencePoint)
- -- Add Physics to GFX
- physics.addBody(left, 'static')
- physics.addBody(right, 'static')
- physics.addBody(top, 'static')
- physics.addBody(bottom, 'static')
- physics.addBody(b1, 'static')
- physics.addBody(b2, 'static')
- physics.addBody(b3, 'static')
- physics.addBody(b4, 'static')
- physics.addBody(h1, 'static', {radius = 15})
- physics.addBody(h2, 'static', {radius = 15})
- physics.addBody(h3, 'static', {radius = 15})
- physics.addBody(h4, 'static', {radius = 15})
- physics.addBody(h5, 'static', {radius = 15})
- physics.addBody(player, {radius = 14})
- physics.addBody(goal, 'static', {radius = 15})
- -- Set Holes as Sensors
- h1.isSensor = true
- h2.isSensor = true
- h3.isSensor = true
- h4.isSensor = true
- h5.isSensor = true
- gameListeners('add')
- end
步驟三十二: 游戲監(jiān)聽器
下列代碼的作用是為應(yīng)用程序添加重力加速及物理碰撞監(jiān)聽器。代碼還能通過遞交參數(shù)來移除這些效果。
- function gameListeners(action)
- if(action == 'add') then
- Runtime:addEventListener('accelerometer', movePlayer)
- player:addEventListener('collision', onCollision)
- player:addEventListener('touch', dragPaddle)
- else
- Runtime:removeEventListener('accelerometer', movePlayer)
- player:removeEventListener('collision', onCollision)
- player:removeEventListener('touch', dragPaddle)
- end
- end
步驟三十三: 移動小球
以下函數(shù)用來捕捉物理加速值，并根據(jù)結(jié)果給小球的X及Y屬性賦值。
- function movePlayer:accelerometer(e)
- player.x = player.x + (e.yGravity*-15)
- player.y = player.y + (e.xGravity*-15)
- end
步驟三十四: 物理碰撞
當(dāng)小球與其它對象發(fā)生碰撞時，其名稱會與觸碰對象相比照。根據(jù)對象類型的不同（陷阱小洞及目的地），游戲會給出不同的提示信息。
- function onCollision(e)
- if(e.other.name == 'h') then
- alert()
- elseif(e.other.name == 'g') then
- alert('win')
- end
- end
步驟三十五: 提示信息
提示信息被觸發(fā)時，游戲中的所有監(jiān)聽器都會被移除，并在播放音效的同時顯示正確的文本內(nèi)容。
- function alert(action)
- local alert
- gameListeners('rmv')
- if(action == 'win') then
- alert = display.newImage('complete.png')
- alert.x = display.contentCenterX
- alert.y = display.contentCenterY
- transition.from(alert, {time = 300, xScale = 0.3, yScale = 0.3})
- audio.play(bell)
- else
- alert = display.newImage('gameOver.png')
- alert.x = display.contentCenterX
- alert.y = display.contentCenterY
- transition.from(alert, {time = 300, xScale = 0.3, yScale = 0.3})
- audio.play(buzz)
- end
- end
步驟三十六: 模擬移動
這一步純屬建議，大家可以將下列代表添加進(jìn)來，借以在模擬環(huán)境下拖動小球，觀察移動方式是否與預(yù)期相符。
- function dragPaddle(e)
- if(e.phase == 'began') then
- lastY = e.y - player.y
- lastX = e.x - player.x
- elseif(e.phase == 'moved') then
- player.y = e.y - lastY
- player.x = e.x- lastX
- end
- end
步驟三十七: 調(diào)用Main函數(shù)
為了在應(yīng)用啟動時進(jìn)行初始化，我們需要調(diào)用Main函數(shù)。上述代碼編寫完成之后，我們只需編輯以下內(nèi)容即可實現(xiàn)初始化需求：
- Main()
步驟三十八: 載入界面
當(dāng)我們啟動指南針應(yīng)用時，iOS系統(tǒng)會逐項載入基本數(shù)據(jù)，這時Default.png文件將作為背景圖案顯示在主屏幕當(dāng)中。將這張圖片保存到我們的項目資源文件夾中，這樣它就會被自動添加到Corona的編譯器中。
步驟三十九: 圖標(biāo)
現(xiàn)在大家的做圖功力就該派上用場了，快為自己的應(yīng)用打造一款美觀又令人印象深刻的圖標(biāo)吧。在非視網(wǎng)膜屏的iPhone設(shè)備上，圖標(biāo)文件的尺寸應(yīng)為57x57像素，而視網(wǎng)膜屏則需要114x114像素，另外我們還需要為iTunes軟件商店打造一個512x512的大版圖形。我建議大家先以512x512像素為基準(zhǔn)設(shè)計，然后再縮小成其它兩種尺寸。
大家沒必要在圖標(biāo)制作方面過分投入精力，制作圓角或者添加半透明特效完全是種花蛇添足——因為iTunes與iPhone會自動為你實現(xiàn)這些效果。
步驟四十: 在模擬環(huán)境下進(jìn)行測試
是時候進(jìn)行最終測試了。打開Corona模擬器，選擇我們的項目文件夾并點擊“打開”。如果一切都依照預(yù)期效果順利運行，那么我們就可以著手做***一項工作了。
步驟四十一: 創(chuàng)建
在Corona模擬器中，點選文件選項下的創(chuàng)建項并選擇目標(biāo)設(shè)備平臺。在對話框中輸入項目數(shù)據(jù)并點擊創(chuàng)建按鈕。等上幾秒，我們的應(yīng)用作品就大功告成啦！接下來大家可以在設(shè)備上進(jìn)行實機(jī)測試，或者直接將應(yīng)用發(fā)布到軟件商店中。
總結(jié)
后期測試總是越多越好，當(dāng)我們對自己的應(yīng)用作品詳加打磨后，發(fā)行用戶版吧——這也許會成為輝煌成功的***步！
希望這篇指南文章能夠幫助大家在移動開發(fā)的道路上越走越好，感謝朋友們的支持！
原文鏈接：
責(zé)任編輯：佚名
來源：
51CTO.com
