OpenGL Game 設計 : 2D卷軸 動畫 人物移動

【時間】2011-06-05 •【分類】遊戲 •【作者】魔旅士

前幾天, 使用 OpenGL 寫一段簡單動畫, 來測試人物移動與遠方背景變化(背景捲動). 基本上這是一個採用 OpenGL來設計電腦遊戲的練習, 主要是要產生2D卷軸式動畫與人物移動的動畫效果.

Move_Test_01A-2011-06-05-14-46-36-83a

OpenGL Game 設計 : 2D卷軸 動畫 & 人物移動

新版增加的效果

[新版V4] 人物移動測試動畫: 增加10隻電腦人, 會自己隨意動作(走/轉/站). 新版人物移動測試, (by VC++ Studio 2008, OpenGL 3.7). 為了測試多人物的 loading, 我增加了下面的幾種效果, 並且根據 Luke 建議修改圖檔為資源檔(resource, 共400k), 直接讀進記憶體.
(1) 增加10隻電腦人, 會自己走動 / 轉身 / 靜止. 就是隨便趴趴走啦….
(2) 實際上, 增加到20~30隻以上的電腦人物, 也不會有問題.
(3) 畫面中央, 會跳動的角色是我操縱的人物.
(4) 每位電腦人都有紅色英文名字標示區分喔!

(新版2D卷軸動畫) 人物移動測試: 增加10~20隻電腦人(BOT), 電腦人(BOT)會自己隨意動作. 跳動的藍色怪物是由我操作的角色, 很酷的喔!! (圖檔來源:網路遊戲MapleStory截圖)

這裡是貼在 YouTube 的動畫測試結果, 我認為還算可接受. 不過, 使用 Fraps 程式截取螢幕時, 會拖慢 CPU 執行速度, 所以動畫的流暢度下降. 實際運作的移動速度會增加1.5倍以上.

動畫: 人物移動之製作方法

製作方法還算簡單, 比起寫RPG來說算是單純很多. 說起來, 這只能算是遊戲的一個”小模組”罷了..

簡單說明製作方法:

(1) 準備圖檔: 背景, 地面, 人物 (走路姿是共有四組). 資料來源: 線上遊戲/截圖.

(2) 基本運作流程 :

2D捲軸式人物移動 程式基本參數

(2-0) 採用OpenGL double buffer繪製, 640×480解析度.
(2-1) 背景貼圖. 背景在遠方, 不需要 MASK.
(2-2) 地板貼圖, 重複四次. 這裡用了小的地板圖, 用來節省圖檔空間. 如果增加使用多張背景圖與MASK圖檔, 產生的背景”遠近效果”會比較好.
(2-3) 人物走動分為四張圖, 採用1-2-3-4-1-2-3-4輪動. 人物圖檔製作比較費時, 尤其是我的繪圖軟體都是免費版, 製作MASK品質不太好. 但是, 自己再手動調整也可以把圖修好.
(2-4) 人物跳躍設定一張圖, 高度則分七個位置.
(2-5) 人物站立設定一張圖, 自動立正站好.

(3) 幾個運作的原則:

2D捲軸式人物移動 技巧

(3-1) 設定左右移動範圍, 接近左右兩端, 改變移動模式為移動人物. 若其他時間則捲動背景.
(3-2) 讀取Keyboard方向鍵與其他按鍵, 並偵測按鍵是否放開. 利用收集到鍵盤資訊, 設定人物貼圖. 改變方向時, 更改人物TEXTURE. 轉向: 採用左右MIRROR鏡射貼圖即可.
(3-3) 記得要微調人物的中心線, 轉方向時才會自然真實.

(4) 如果要減低讀取硬碟檔案的loading, 可以把圖檔(BMP)改為VC++的資源(Resources). 這樣執行起來也不會有一堆的圖片檔案, 檔案夾裡就清爽多了. 如果要更省時間, 就得改用PNG/GIF等的壓縮圖檔, 我也還沒有找到方便的程式庫. 自己寫更是太瘋啦…

(5) 這個動畫測試採用2D水平捲動, 只需要用 glMatrixMode(GL_MODELVIEW) 模式.

感謝網路上一推高手的文章協助, 所以寫起程式來很快. 反而是調整畫面效果很花時間.

參考資料

【參考】: OpenGL Game 設計: 2D RPG Game OpenGL/VC++ / 魔旅士.
【參考】: OpenGL Game 設計: 2.5D 的世界 OpenGL/VC++ / 魔旅士.
【參考】: OpenGL Game 設計: CS-like 3D World 射擊 (更新版) 魔旅士.

Latest posts by 魔旅士 (see all)
【分類】遊戲 • 【標籤】

MORRISJFWONG / 採用 Wordpress 架設