【Flame 學習筆記】使用 Flame 遊戲引擎的專案結構指南

更新於 2024/12/01閱讀時間約 4 分鐘
raw-image
【Flame 學習筆記】系列文章目錄:連結
【Flutter 學習筆記】線上課程教學影片:連結
【Flutter 學習筆記】系列文章目錄:連結

在開發使用 Flutter 的遊戲時,Flame 遊戲引擎提供了一個建議的專案結構,這個結構不僅包含標準的 Flutter 資源目錄,還包括一些子目錄:音效(audio)、圖片(images)和磚塊(tiles)。這樣的結構能夠幫助開發者更有條理地管理遊戲資源。

專案結構範例

以下是使用 Flame 的範例程式碼:

void main() {
FlameAudio.play('explosion.mp3');

Flame.images.load('player.png');
Flame.images.load('enemy.png');

final map1 = TiledComponent.load('level.tmx', tileSize);

final map2 = await SpriteFusionTilemapComponent.load(
mapJsonFile: 'map.json',
spriteSheetFile: 'spritesheet.png'
);
}

根據這段程式碼,Flame 預期的檔案結構如下:

└── assets
├── audio
│ └── explosion.mp3
├── images
│ ├── enemy.png
│ ├── player.png
│ └── spritesheet.png
└── tiles
├── level.tmx
└── map.json

你可以選擇將音效資料夾進一步細分為兩個子資料夾,一個用於音樂(music),另一個用於音效(sfx)。

更新 pubspec.yaml

在使用這些資源之前,別忘了將檔案路徑添加到 pubspec.yaml 檔案中:

flutter:
assets:
- assets/audio/explosion.mp3
- assets/images/player.png
- assets/images/enemy.png
- assets/tiles/level.tmx

自訂專案結構

如果你希望更改這個結構,可以使用 prefix 參數,並創建自己的 AssetsCacheImagesAudioCache 實例,而不是使用 Flame 提供的全域實例。此外,AssetsCacheImages 也可以接收自訂的 AssetBundle,這樣可以讓 Flame 在不同於 rootBundle 的位置尋找資源,例如在檔案系統中。

透過這些設置,你可以靈活地管理遊戲資源,提升開發效率,讓你的遊戲開發過程更加順利。希望這篇文章能幫助你更好地理解 Flame 的專案結構,並在開發過程中獲得靈感!

avatar-img
11會員
243內容數
哈囉!歡迎光臨我的沙龍!我是 KT,一位對應用程式開發充滿熱情的開發者。在這個專屬空間,我將與您分享我在應用開發領域的深入學習心得和豐富的實戰經驗。如果您對應用程式開發技術同樣充滿好奇,渴望不斷探索新知,歡迎成為我們的會員,一起在應用程式開發的旅途上,探索更深層次的技術世界,享受學習的樂趣。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
HKT實驗室 的其他內容
本文介紹了 Flame,一款基於 Flutter 的開源遊戲引擎,支持多平台運行(行動裝置、桌面和網頁)。雖然不如 Unity 和 Unreal 知名,但對於熟悉 Flutter 的開發者來說,學習 Flame 是值得的。本文是筆者在學習 Flame 官方文檔過程中的筆記,旨在幫助有興趣的學習者。
本文介紹了 Flame,一款基於 Flutter 的開源遊戲引擎,支持多平台運行(行動裝置、桌面和網頁)。雖然不如 Unity 和 Unreal 知名,但對於熟悉 Flutter 的開發者來說,學習 Flame 是值得的。本文是筆者在學習 Flame 官方文檔過程中的筆記,旨在幫助有興趣的學習者。
你可能也想看
Google News 追蹤
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
這篇文章介紹了網站的整體架構以及開發時所使用的工具和套件,包括 Next.js、Tailwind CSS 和 socket.io 等。文章回顧了程式碼的重構與優化,幫助開發者提高工作效率,適合希望深入瞭解前端開發和網站架構的讀者。
Thumbnail
這篇內容,將會講解什麼是表達式(Expression),什麼是陳述式(Statement)。有了這些概念,各位會更容易理解,要如何設計程式碼。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
Thumbnail
這篇內容,將會用一個簡單的範例,來解釋物件(Object)和實體(Instance)的差別。包括Instance的簡介、ID、物件改變會影響實體。
Thumbnail
這篇內容,將簡單介紹Asset Browser、Workspace、Inspector、Code Browser,作為入門的介面導覽。
Thumbnail
這篇內容,將教你如何開啟新的GameMaker專案,並調整畫面佈局。也會講解,為何建議用英文語系,來進行遊戲開發。
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
這篇文章介紹了網站的整體架構以及開發時所使用的工具和套件,包括 Next.js、Tailwind CSS 和 socket.io 等。文章回顧了程式碼的重構與優化,幫助開發者提高工作效率,適合希望深入瞭解前端開發和網站架構的讀者。
Thumbnail
這篇內容,將會講解什麼是表達式(Expression),什麼是陳述式(Statement)。有了這些概念,各位會更容易理解,要如何設計程式碼。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
Thumbnail
這篇內容,將會用一個簡單的範例,來解釋物件(Object)和實體(Instance)的差別。包括Instance的簡介、ID、物件改變會影響實體。
Thumbnail
這篇內容,將簡單介紹Asset Browser、Workspace、Inspector、Code Browser,作為入門的介面導覽。
Thumbnail
這篇內容,將教你如何開啟新的GameMaker專案,並調整畫面佈局。也會講解,為何建議用英文語系,來進行遊戲開發。
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter