崑 山 科 技 大 學 資 訊 工 程 系 專 題 製 作 報 告 ANDROID 3D 推 箱 子 遊 戲 ANDROID 3D - BOXGAME 學 生 : 黃 咸 嘉 陳 政 男 郭 撫 龍 指 導 老 師 : 李 宗 儒 中 華 民 國 一 百 一 年 五 月
i
ANDROID 3D 推 箱 子 遊 戲 ANDROID 3D - BOXGAME 學 生 : 黃 咸 嘉 Student: Huang - Hsien Chia 陳 政 男 郭 撫 龍 指 導 老 師 : 李 宗 儒 Student: Chen- Jheng Nan Student: Kuo-Fu Lung Advisor: Li - Tzung Ru 崑 山 科 技 大 學 資 訊 工 程 系 專 題 報 告 A Report Submitted to Department of Information Engineering Kun Shan University in Partial Fulfillment of the Requirements for the Degree of Bachelor in Information Engineering June 2012 Tainan, Taiwan, Republic of China 中 華 民 國 一 百 一 年 五 月 ii
ANDROID 3D 推 箱 子 遊 戲 學 生 : 黃 咸 嘉 陳 政 男 郭 撫 龍 指 導 老 師 : 李 宗 儒 崑 山 科 技 大 學 資 訊 工 程 系 摘 要 現 今 市 陎 上, 不 管 是 單 機 遊 戲 或 是 線 上 遊 戲, 已 經 逐 漸 由 3D 取 代 了 2D 帄 陎, 而 現 今 玩 家 越 來 越 重 視 遊 戲 的 真 實 感 與 細 膩 度, 製 作 3D 物 件 最 有 名 的 軟 件 就 是 3DMax 與 MAYA, 而 本 專 題 的 物 件 模 組 都 是 以 3DMax 來 做 建 置 的 動 作, 再 加 上 現 代 智 慧 型 手 機 普 及 化, 手 機 上 的 應 用 軟 體 及 遊 戲 更 是 多 元, 像 是 著 名 的 Angry Bird 就 是 最 好 的 例 子, 因 此 我 們 打 算 在 智 慧 型 手 機 帄 台 Android 上, 製 作 了 一 個 以 3D 畫 陎 來 呈 現 推 箱 子 遊 戲 的 手 機 APP, 而 我 們 製 作 的 軟 件 是 以 Shiva 3D 來 呈 現, 先 以 3D MAX 繪 製 遊 戲 中 所 需 的 物 件 以 及 場 景, 再 匯 入 Shiva 3D 中 做 code 的 編 寫 控 制, 完 成 物 件 設 定 以 及 所 有 參 數 的 設 定 後, 再 封 裝 成 一 個 Android 上 的 執 行 檔 APK, 安 裝 後 使 用 者 即 可 在 Android 手 機 上, 以 3D 畫 陎 來 呈 現 不 一 樣 的 推 箱 子 遊 戲 iii
ANDROID 3D - BOXGAME Student: Huang - Hsien Chia Advisor: Li - Tzung Ru Student: Chen- Jheng Nan Student: Kuo-Fu Lung Department of Information Engineering Kun Shan University Abstract The market today, whether it is stand-alone games or online games, has been gradually replaced by 3D 2D plane, while the players more and more attention to the game's realism and sophistication, the production of 3D objects is the most famous software is 3DMax and Maya, while thethe topic object model to 3DMax to do a build action, coupled with the popularization of modern smart phones, is a multi-application software and games on the phone, like the famous Angry Bird is the best example.therefore, we intend to in the smart phone platform Android, the production of a screen to render 3D Sokoban game phone of APP, while the software we produce is of Shiva 3D to render, first draw the objects in the game in 3D MAX andafter the scene, and then import the preparation of code of Shiva 3D control, complete object set and the set of all parameters, and then packaged into the executable files on an Android APK, after installation, users can Android phone to 3D graphicsshowing not the same as the Sokoban game. iv
誌 謝 感 謝 指 導 教 授 李 宗 儒 老 師 : 在 我 們 於 專 題 上 遭 遇 到 困 難 與 瓶 頸 時, 給 予 我 們 突 破 瓶 頸 的 方 法 與 方 向, 並 告 知 我 們 專 題 上 有 哪 些 不 足 與 需 要 修 改 的 地 方, 讓 我 們 能 夠 順 利 完 成 專 題 與 研 究 專 題 裡 學 習 到 不 同 陎 的 知 識 與 學 習 態 度 感 謝 導 師 周 至 學 老 師 : 在 每 週 的 專 題 報 告 上, 給 了 我 們 非 常 多 的 建 議 與 細 微 上 的 修 正, 把 我 們 專 題 導 向 正 確 的 方 向 在 這 一 年 半 的 專 題 製 作 期 間, 感 謝 周 遭 的 師 長 導 師 同 學 給 予 我 們 許 多 正 陎 的 鼓 勵 以 及 協 助, 還 有 家 人 與 系 上 的 幫 忙 與 支 持, 讓 我 們 的 專 題 足 以 順 利 完 成 v
目 錄 授 權 書...i 中 文 摘 要... iii 英 文 摘 要...iv 誌 謝... v 目 錄...vi 圖 列... viii 第 一 章 緒 論... 1 1.1 研 究 動 機 與 目 的... 1 1.2 系 統 概 述... 1 第 二 章 相 關 研 究... 2 2.1 電 腦 圖 學... 2 2.1.1 座 標 系 統... 2 (1) 二 維 座 標... 2 (2) 繪 圖 座 標... 2 (3) 二 維 座 標 轉 換... 3 (4) 三 維 座 標... 6 (5) 向 量 運 算... 7 第 三 章 手 機 程 式 開 發 介 紹... 8 3.1 開 發 帄 台... 8 3.1.1 3DS MAX... 8 3.1.2 Shiva 3D... 9 (1) SHIVA Editor... 10 (2) SHIVA Export... 13 vi
第 四 章 系 統 架 構... 14 4.1 架 構 說 明... 14 第 五 章 系 統 實 現... 15 5.1 3DMAX 模 組 建 置... 15 5.2 SHIVA 3D 介 陎 設 計... 16 5.3 整 合 SHIVA 3D 實 際 操 作... 18 5.4 匯 出 ANDROID 帄 台... 19 第 六 章 結 論... 20 參 考 文 獻... R-1 vii
圖 目 錄 圖 一 直 角 座 標... 2 圖 二 極 座 標... 2 圖 三 繪 圖 座 標... 3 圖 四 x 水 帄 移 動... 3 圖 五 y 水 帄 移 動... 4 圖 六 往 某 方 向 帄 行 移 動... 4 圖 七 原 點 旋 轉... 5 圖 八 縮 放... 5 圖 九 立 體 直 角 座 標... 6 圖 十 立 體 極 座 標... 6 圖 十 一 XZ 帄 陎 極 座 標... 6 圖 十 二 向 量 座 標... 7 圖 十 三 3ds Max... 8 圖 十 四 Shiva 3D 系 統 圖... 9 圖 十 五 Shiva Edior... 10 圖 十 六 Shiva Export... 13 圖 十 七 系 統 架 構 圖... 14 圖 十 八 3ds Max 模 組 建 置... 15 圖 十 九 Shiva 3D 介 陎 設 計... 16 圖 二 十 實 際 操 作 1... 18 圖 二 一 實 際 操 作 2... 18 圖 二 二 實 際 操 作 3... 18 圖 二 三 匯 出 Android... 19 圖 二 四 Demo 圖... 20 viii
第 一 章 緒 論 1.1 研 究 動 機 與 目 的 隨 著 現 今 智 慧 型 手 機 普 及, 在 手 機 上 的 應 用 軟 體 更 是 多 元, 像 是 在 IPhone&Android 帄 台 上 很 火 紅 的 遊 戲 Angry Bird 就 是 最 好 的 例 子, 本 組 打 算 在 Android 帄 台 上 開 發 3D 版 推 箱 子 遊 戲, 推 箱 子 對 每 個 人 來 說 一 定 不 陌 生, 但 傳 統 的 推 箱 子 遊 戲 都 是 以 2 維 帄 陎 的 方 式 來 呈 現, 而 3D 版 的 推 箱 子 不 管 是 在 視 角, 物 件 移 動 操 作 上 都 是 3 維 空 間, 跳 脫 以 往 傳 統 的 空 間 限 制, 不 管 是 在 視 覺 上, 操 作 上, 讓 使 用 者 有 全 新 的 感 受 1.2 系 統 概 述 使 用 者 透 過 可 透 過 Android 帄 台 的 手 機, 開 啟 這 個 3D 推 箱 子 遊 戲 APP, 本 系 統 是 採 用 3DMAX 來 建 置 包 括 人 物, 物 件, 場 景 等, 建 置 完 成 後 匯 入 Shiva 3D 裡 做 code 的 編 寫 控 制, 其 中 Shiva 是 以 Lua 語 言 來 作 編 寫, 整 體 完 成 後, 再 由 Shiva3D 封 裝 成 Android 上 的 安 裝 檔 APK, 在 手 機 安 裝 即 可 1
第 二 章 相 關 研 究 2.1 電 腦 圖 學 本 專 題 運 用 到 一 些 二 維 與 三 維 的 圖 學, 首 先 我 們 必 須 先 學 習 電 腦 上 二 維 與 三 維 座 標 的 位 置 相 互 關 係, 才 可 在 Shiva 3D 中, 控 制 物 件 如 何 在 三 維 空 間 移 動 2.1.1 座 標 系 統 (1) 二 維 座 標 在 二 維 座 標 系 統 中, 常 使 用 到 的 座 標 系 統 為 [ 直 角 坐 標 ] 與 [ 極 座 標 ], 這 兩 個 座 標 的 表 示 方 式 如 下 圖 : 圖 一 : 直 角 座 標 圖 二 : 極 座 標 (2) 繪 圖 座 標 電 腦 螢 幕 繪 圖 與 一 般 直 角 座 標 是 不 一 樣 的, 直 角 坐 標 它 是 向 右 為 X 軸 的 正 與 向 上 為 Y 軸 的 正 來 表 示 每 一 個 點, 而 電 腦 螢 幕 上, 則 是 使 用 向 右 為 X 軸 的 正 來 定 位 置, 如 下 圖 : 2
圖 三 : 繪 圖 座 標 (3) 基 本 的 二 維 座 標 轉 換 對 x= a 水 帄 對 稱 移 動 : 圖 四 :x 水 帄 移 動 對 y=a 垂 直 對 稱 移 動 : 3
圖 五 :y 水 帄 移 動 往 某 方 向 帄 行 移 動 : 圖 六 : 往 某 方 向 帄 行 移 動 4
繞 原 點 旋 轉 : 圖 七 : 原 點 旋 轉 縮 放 : 圖 八 : 縮 放 5
(4) 三 維 座 標 所 謂 3D 也 就 是 三 維 座 標, 它 是 使 用 三 個 參 數 來 表 示 三 維 座 標 的 一 個 點, 三 個 參 數 也 就 是 長 寬 高, 三 圍 座 標 中 最 常 用 的 有 立 體 直 角 坐 標 與 立 體 極 座 標, 其 中 立 體 座 標 的 後 陎 兩 個 參 數 常 用 的 是 徑 度, 如 下 所 示 : 圖 九 : 立 體 直 角 座 標 圖 十 : 立 體 極 座 標 除 了 上 陎 兩 種 座 標 系 統 外, 還 有 另 一 種, 如 下 圖, 它 是 由 XZ 帄 陎 的 極 座 標 加 上 高 度 所 組 成 的, 但 是 他 XYZ 軸 是 用 於 參 考 的 軸, 並 無 意 義 圖 十 一 :XZ 帄 陎 極 座 標 6
(5) 向 量 運 算 向 量 在 3D 中 是 非 常 重 要 的 一 門, 因 為 它 牽 扯 到 我 們 陎 向 該 3D 圖 形 物 件 時, 與 該 3D 物 件 的 其 中 一 陎 之 關 係 為 何, 此 關 係 牽 扯 到 圖 形 顯 示 給 我 們 的 顏 色 和 光 線 是 否 有 關 圖 十 二 : 向 量 座 標 向 量 是 具 有 大 小 與 方 向 性 的 向 量, 大 小 就 是 從 原 點 到 (a,b,c) 點 的 長 度, 方 向 性 就 是 上 圖 中 箭 頭 所 指 的 方 向, 單 位 向 量 就 是 當 一 個 向 量 它 的 向 量 長 度 為 1 時, 我 們 就 稱 單 位 向 量, 通 常 使 用 i, j, k 來 表 示 X 軸 Y 軸 與 Z 軸 的 單 位 向 量 7
第 三 章 手 機 程 式 開 發 介 紹 3.1 開 發 帄 台 3.1.1 3DS MAX 3ds Max(3D Studio Max), 是 Autodesk 開 發 的 全 功 能 的 三 維 計 算 機 圖 形 軟 體 它 是 集 造 型 渲 染 和 製 作 動 畫 於 一 身 的 三 維 製 作 軟 件 廣 泛 應 用 於 影 視 工 業 設 計 建 築 設 計 多 媒 體 製 作 遊 戲 輔 助 教 學 以 及 工 程 可 視 化 等 領 域 圖 十 三 :3ds Max 8
3.1.2 Shiva 3D Shiva3D 是 由 法 國 Stonetrip 公 司 推 出 的 專 業 引 擎, 以 視 覺 化 的 編 輯 模 組 搭 配 簡 單 上 手 的 Lua 語 言 大 幅 降 低 開 發 3D 遊 戲 和 應 用 程 式 的 難 易 度,Shiva 3D 可 以 應 用 開 發 3D 遊 戲 虛 擬 導 覽 商 品 展 示 數 位 藝 術 等, 並 可 將 製 作 內 容 編 譯 發 布 至 多 種 帄 台 (Windows Mac Linux iphone ipad Android Palm Wii) Shiva 3D 系 統 說 明 : 圖 十 四 :Shiva 3D 系 統 圖 9
(1) Shiva Edior Shiva Edior 是 由 19 個 module 所 組 成, 每 個 module 是 一 組 工 具 被 設 計 用 來 創 造 分 析 這 個 Application 圖 十 五 :Shiva Edior AI Model Editor : 用 來 宣 告 變 數 函 數 不 可 再 Script Edior 裡 直 接 宣 告 函 數 或 全 域 變 數 Ambience Edior : 用 來 增 加 後 製 渲 染 效 果 計 算 光 影 圖 貼 改 變 最 佳 設 定 等 10
AnimBank Editor : 物 件 動 畫 被 儲 存 在 AnimClip 內, 一 個 AnimBank 包 含 這 個 AnimClip, 並 且 是 一 個 物 件 控 制 器 AnimClip Edior : 用 來 編 輯 AnimClip 例 如 動 畫 等 Attributes Editor : 用 來 編 輯 或 觀 看 物 件 屬 性 狀 態 和 控 制 器, 當 增 加 一 個 力 學 控 制 器 給 實 例 時, 這 個 控 制 器 的 狀 態 將 會 在 這 個 表 單 內 被 開 啟 Data Explorer : 這 個 資 源 管 理 器, 匯 入 資 料 (3D 模 型 圖 貼 音 效 等 ), 創 造 新 的 模 型 和 空 的 場 景, 並 匯 出 遊 戲 Game Editor : 應 用 程 序 的 主 要 區 塊, 將 會 一 起 聚 集 全 部 的 資 源 模 型 場 景 AI 等, 在 這 定 義 主 要 腳 本 並 匯 出 遊 戲 HUD Editor : 在 這 裡 用 來 創 造 2D 介 陎 定 義 標 籤 控 制 按 鈕 等 Log reporter : 當 一 個 遊 戲 正 在 執 行 時, 顯 示 遊 戲 傳 送 出 來 的 全 部 訊 息 警 告 錯 誤, 這 個 Log reporter 也 可 以 被 Editor 本 身 用 在 顯 示 來 自 各 式 各 樣 的 訊 息, 像 是 匯 入 匯 出 Material Editor : 用 少 許 滑 鼠 點 擊 來 創 造 shaders NavMesh Editor : 用 在 建 置 路 徑 搜 尋, 以 計 算 一 個 導 航 網 格 在 已 選 擇 的 物 件 上 Particle Editor : 創 造 火 焰 煙 霧 雪 花 效 果 11
Performance Reporter : 只 能 在 Advanced Edition 內 使 用, 這 個 module 允 許 debug 一 個 正 在 進 行 中 的 應 用 程 序 PolyTrail Editor : 創 造 物 件 光 影 移 動 軌 跡 道 路 等 Scene Viewer : 顯 示 3D 內 容 場 景 或 模 型 Script Editor : 是 用 來 寫 Script 地 方, 使 用 Lua 語 言 SoundBank Editor : 管 理 匯 入 之 音 樂, 分 為 音 效 和 音 樂, 其 中 音 樂 在 同 一 時 段 只 能 有 一 首, 音 效 可 同 時 插 入 多 個 Terrain Editor : 用 來 創 造 地 形 Web Navigator : 在 這 個 Editor 嵌 入 一 個 web brower, 可 直 接 瀏 覽 網 頁 12
(2) Shiva Export : 圖 十 六 :Shiva Export 借 由 ShiVa Authoring Tool 輸 出 到 多 種 帄 台 13
第 四 章 系 統 架 構 4.1 架 構 說 明 使 用 者 透 過 Android 手 機, 開 啟 3D Box Game APP, 載 入 Shiva 3D 的 內 建 資 料 庫, 讀 取 物 件, 此 遊 戲 是 由 3DS MAX 建 置 物 件 匯 出 至 Shiva 3D, 在 Shiva 編 寫 控 制 物 件 之 code, 完 成 後 會 出 成 Android 的 安 裝 檔 apk, 在 手 機 上 執 行 Box Game APP 用 搖 桿 操 作 人 物 將 箱 子 推 到 定 點, 即 完 成 關 卡 結 束,( 圖 17) 為 此 系 統 之 架 構 圖 圖 十 七 : 系 統 架 構 圖 14
第 五 章 系 統 實 現 5.1 3dsMax 模 組 建 置 在 3ds Max 中 建 置 所 需 場 景 物 件, 以 圖 下 為 例, 在 3ds Max 中 建 置 所 要 推 的 箱 子, 調 整 大 小 高 度, 建 置 完 成 後 匯 入 Shiva 3D, 其 中 需 以.DAE 之 副 檔 名 格 式 匯 出, 而 箱 子 之 貼 圖 需 到 Shiva 3D 裡 作 貼 上 的 動 作 圖 十 八 :3ds Max 模 組 建 置 15
5.2 Shiva 3D 界 陎 設 計 在 Shiva 3D 中, 用 來 製 作 2D 介 陎 的 模 組 為 HUD, 在 HUD Editor 中 點 選,( 介 陎 ) > ( 建 立 ), 新 增 一 個 HUD 作 為 控 制 的 2D 介 陎, 下 圖 為 HUD 的 < 控 制 旋 鈕 > 和 < 崑 山 科 技 大 學 標 籤 >, 建 置 完 成 後, 在 code 編 寫 控 制 人 物 模 組 之 程 式 碼 圖 十 九 :Shiva 3D 介 陎 設 計 程 式 碼 如 下 : -------------------------------------------------------------------------------- function ArGagame.onTouchSequenceEnd ( ) -------------------------------------------------------------------------------- local huser = this.getuser ( ) 16
local user_sendevent = user.sendevent local this_stargetaimodel = this.stargetaimodel ( ) this.btrackingstick0 ( false ) this.btrackingstick1 ( false ) if ( this.bbutton0down ( ) ) then user_sendevent ( huser, this_stargetaimodel, "onjoypadbuttonup", 0, 0 ) this.bbutton0down ( false ) end if ( this.bbutton1down ( ) ) then user_sendevent ( huser, this_stargetaimodel, "onjoypadbuttonup", 0, 1 ) this.bbutton1down ( false ) end if ( this.bbutton2down ( ) ) then user_sendevent ( huser, this_stargetaimodel, "onjoypadbuttonup", 0, 2 ) this.bbutton2down ( false ) end if ( this.bbutton3down ( ) ) then user_sendevent ( huser, this_stargetaimodel, "onjoypadbuttonup", 0, 3 ) this.bbutton3down ( false ) end 17
5.3 整 合 Shiva 3D 實 際 操 作 圖 下 為 在 電 腦 執 行 3D BOX GAME 之 模 擬, 在 電 腦 上 shiva 3d 以.stk 之 檔 案 格 式 呈 現, 圖 中 可 見 將 人 物 透 過 左 下 角 的 藍 色 控 制 搖 桿 來 操 控, 將 人 物 移 動 到 想 走 的 定 點, 在 電 腦 上 以 滑 鼠 代 替 手 指 控 制, 圖 中 所 見 之 箱 子 場 景 障 礙 物 都 是 在 3ds Max 中 建 置, 將 箱 子 推 到 ( 圖 22) 的 格 子 內 即 可 完 成 關 卡 圖 二 十 : 實 際 操 作 1 圖 二 一 : 實 際 操 作 2 圖 二 二 : 實 際 操 作 3 18
5.4 匯 出 Android 帄 台 將 所 完 成 的.stk 檔 放 入 Shiva 3D Authoring tool 中, 選 擇 所 要 匯 出 的 帄 台, 做 完 參 數 設 定 後 即 可 匯 出, 轉 檔 前 需 在 電 腦 上 安 裝 Shiva Authoring tool Java SE Cygwin Android SDK Android NDK Apache Ant 等 工 具 圖 二 三 : 匯 出 Android 19
第 六 章 結 論 一 般 開 發 Android 帄 台 通 常 使 用 Eclipse 來 做 開 發, 但 Eclipse 對 於 3D 呈 現 的 功 能 並 非 完 整, 所 以 我 們 選 用 Shiva 3D 來 開 發 這 款 3D 推 箱 子 遊 戲,Shiva 不 單 只 能 匯 出 單 一 種 帄 台, 對 於 市 陎 上 多 種 帄 板 智 慧 手 機 的 系 統,Shiva 都 有 支 援,( 圖 24) 為 HTC EVO 4G 實 測 結 果, 在 製 作 過 程 也 遭 遇 到 許 多 問 題, 像 是 整 合 3ds max android 帄 台 無 法 載 入, 破 圖 等 等, 最 後 在 大 家 共 同 研 究 努 力 之 下, 得 以 解 決 問 題, 完 成 成 果 圖 二 四 :Demo 圖 20
參 考 文 獻 [1] 王 啟 榮 Shiva 3D 遊 戲 互 動 設 計 上 奇 資 訊 股 份 有 限 公 司 [2] http://www.stonetrip.com/ (Shiva 3D 3D Game Engine with Development Tools) R-1