Flutter 遊戲開發，不只是程式：如何從有想法到實現一款遊戲(一)
前言
當今時代，遊戲已經不再只是單純的娛樂，更成為人們生活中不可或缺的一部分。隨著技術的發展，遊戲也從單機遊戲轉變成網路遊戲、手機遊戲、虛擬實境(VR)遊戲等多種形式。Flutter 作為一種跨平台的開發框架，正逐漸成為開發遊戲的一個重要工具。本系列文章將以「輕鬆入門 Flutter 遊戲開發」為題，從最基礎的開始，帶領讀者一步步學習如何使用 Flutter 開發遊戲。不需要太多的程式基礎，只需要一份對遊戲的熱愛，就可以在本系列文章中學習到足夠的知識，讓自己打造出自己的第一款遊戲。讓我們一起開始這段有趣的學習之旅吧！
我的背景
我是一個熱愛玩遊戲想一些鬼點子的人，目前擔任前端工程師，負責網頁的製作與設計，在上班的閒暇時間時不時會腦動大開，把想到的遊戲點子寫在手機記事本上，遊戲發想來源都來自於生活上，例如，走在路上看到路上的車子呼嘯而過時，我就在想要不要來寫個動態視力大挑戰的遊戲XD，看到新聞說台灣是一個行人地獄時，就來寫個扮演台灣行人並走在路上去指定地點的遊戲等等，雖然想了一堆但都還沒去實現，在決定寫 flutter 之前，我開發了一個線上桌遊多人連線網站，寫完並上線後，推薦給我的同事或朋友們玩玩，他們都有一致的想法「怎麼手機版體驗這麼差，畫面這麼醜XD，bug 一堆」，這時候我才領悟到現在大家比較少會去玩網頁遊戲了，以前的 Flash 和 Facebook 小遊戲的時代已經過了QQ。
之後我開始想要寫手機遊戲，買了 Unity 課程看了一遍又一遍，本身的技能樹都點在了前端，跳去寫 C#(Unity 用的開發語言) 真的是不習慣，開發成本太高了，在某天偶然聽到同事的朋友在用 flutter 寫專題，看了他的語法覺得很新鮮，又是 google 爸爸開發維護，又是跨平台，寫一套上架到兩個平台，又跟 React 有點像(排除 React Native 想學學新東西XD) 就決定是你了，之後就開啟了學習 flutter 之旅。
啟航準備
進入正題，工欲善其事，必先利其器，首先需要準備開發工具以及開發環境：
- 下載 flutter
- 下載 VScode / Android Studio 也可以，看個人喜好
- 測試你的模擬器跑不跑得起來
- 開啟一個專案改改看字，看有沒有 hot reload
- 詳細環境設定流程可以看官方教學
遊戲模板
這是官方提供的遊戲開發模板，他提供了基礎的功能：
- sound - 音效模組
- music - 音樂模組
- main menu screen - 主畫面有先寫好
- settings - 遊戲設定的頁面
- ads (AdMob) - 遊戲廣告模組
- in-app purchases - 在 app 裡購買商品的模組
- games services - Game Center & Google Play Games Services
- crash reporting - Firebase Crashlytics
這個範例可以載下來後跑起來試試看，他是一個簡單的遊戲，提供一個完整的專案架構及功能，包含轉場動畫、Landing Page、關卡設計，讓你專心在遊戲開發邏輯上，是個很方便的腳手架。
結語
開發遊戲是一個需要極大的熱誠的事情，你會常常刪了又改，改了又刪，怎麼樣都不滿意，非常容易會放棄，不過我很享受開發中了樂趣，有時候一個小邏輯 bug 就可以卡了我一個晚上，當你到了該睡覺的時間卻還沒解出來，那一晚絕對是難以入眠，又或是你躺在床上正要睡著的那一刻，突然想到了新點子，又爬起來拿著筆記本記下來，有太多太多好玩的事可以分享。
謝謝你看到最後，未來會慢慢地更新我開發遊戲的辛酸血淚過程並把它紀錄下來，對了這是我上架的桌遊網站(不是可疑網站哈哈)，非常的陽春XD 目前電腦版的體驗會最好，這可是歷時兩年的開發呢，可以到上面玩玩 ^^
以下為專案連結：
7會員
10內容數
留言
留言分享你的想法！
你可能也想看
Google News 追蹤
在本文中，我們將介紹 TextField 文字輸入框元件及其基本用法。TextField 是一個關鍵的元件，使用者可以輕鬆地輸入文字，廣泛應用於各類應用程式中，如表單、搜尋框和聊天介面等。
本篇文章將深入探討如何在 Flutter 中使用 Image 圖片元件。我們將涵蓋從資源管理到顯示本地資料夾中的圖片，以及如何載入網路圖片的完整過程。透過這篇文章，您將學會如何有效地管理圖片資源，並在應用程式中正確顯示圖片，提升您的 Flutter 開發技能。
這篇文章深入探討了 Flutter 框架中的 ElevatedButton（漂浮按鈕）元件。文章介紹了其基本用法，包括必填參數 onPressed 和 child 的解析，並示範了如何使用匿名函數來處理按鈕點擊事件。此外，還說明了如何設定按鈕的顏色和形狀，並提供了完整的範例程式碼。
在本篇教學中，我們介紹了 Flutter 中的 Row 和 Column 佈局容器，並探討了它們的基本用法及進階技巧。此外，我們還提到如何使用快捷鍵來格式化程式碼，以提升可讀性。
本文深入探討 Flutter 中的 Container 元件，這是一個多功能的包裝 Widget，能夠有效管理和裝飾其他 Widget。文章將詳細說明如何調整 Container 的大小、設置外部間距（margin）以及使用 BoxDecoration 來自訂樣式。
本文介紹建立第一個 Flutter 應用程式的方法。包括打開 Visual Studio Code 建立專案，在 iOS、Android 模擬器及真實設備、Web 和桌面環境運行的步驟。成功建立是重要里程碑，可探索更多功能，持續練習提升技能。
本文介紹如何建立第一個 Flutter 應用程式。如何在 Visual Studio Code 中建立專案，包括專案類型選擇、存放位置設定等。還介紹了在 iOS、Android 模擬器、真實設備及建立 Web、桌面應用程式執行的方法
一個獨立開發者，立志打造顛覆性的遊戲體驗，在開拓全新玩法的道路上，砥礪前行。
大家好，我正在開發一款獨立遊戲，以魔法戰鬥為主題，如果想要嘗試遊戲的demo，歡迎到下方連結處，加入我的Discord群組。
魔法與戰鬥的世界---開發中的遊戲
這款遊戲發生在一個飄浮於雲端之上的世界，
這篇內容，簡單介紹了GameMaker的遊戲製作原理。包括Object、參數、程式碼等概念。同時也簡單介紹了GameMaker的適用範圍和特色。
Instrumect 是我從2022年10月開始製作的遊戲。
在那之前，其實嘗試過各種大大小小的遊戲開發，包括RPG、橫向射擊、2D平台遊戲等，但最後都熱情耗盡，所有項目皆斷尾(ゝ∀･)⌒☆
當初會選擇開發那些類型，不外乎考慮市場熱門程度和製作難易度。而最後會沒了熱情，是因為我對那類遊戲興趣沒很
在本文中，我們將介紹 TextField 文字輸入框元件及其基本用法。TextField 是一個關鍵的元件，使用者可以輕鬆地輸入文字，廣泛應用於各類應用程式中，如表單、搜尋框和聊天介面等。
本篇文章將深入探討如何在 Flutter 中使用 Image 圖片元件。我們將涵蓋從資源管理到顯示本地資料夾中的圖片，以及如何載入網路圖片的完整過程。透過這篇文章，您將學會如何有效地管理圖片資源，並在應用程式中正確顯示圖片，提升您的 Flutter 開發技能。
這篇文章深入探討了 Flutter 框架中的 ElevatedButton（漂浮按鈕）元件。文章介紹了其基本用法，包括必填參數 onPressed 和 child 的解析，並示範了如何使用匿名函數來處理按鈕點擊事件。此外，還說明了如何設定按鈕的顏色和形狀，並提供了完整的範例程式碼。
在本篇教學中，我們介紹了 Flutter 中的 Row 和 Column 佈局容器，並探討了它們的基本用法及進階技巧。此外，我們還提到如何使用快捷鍵來格式化程式碼，以提升可讀性。
本文深入探討 Flutter 中的 Container 元件，這是一個多功能的包裝 Widget，能夠有效管理和裝飾其他 Widget。文章將詳細說明如何調整 Container 的大小、設置外部間距（margin）以及使用 BoxDecoration 來自訂樣式。
本文介紹建立第一個 Flutter 應用程式的方法。包括打開 Visual Studio Code 建立專案，在 iOS、Android 模擬器及真實設備、Web 和桌面環境運行的步驟。成功建立是重要里程碑，可探索更多功能，持續練習提升技能。
本文介紹如何建立第一個 Flutter 應用程式。如何在 Visual Studio Code 中建立專案，包括專案類型選擇、存放位置設定等。還介紹了在 iOS、Android 模擬器、真實設備及建立 Web、桌面應用程式執行的方法
一個獨立開發者，立志打造顛覆性的遊戲體驗，在開拓全新玩法的道路上，砥礪前行。
大家好，我正在開發一款獨立遊戲，以魔法戰鬥為主題，如果想要嘗試遊戲的demo，歡迎到下方連結處，加入我的Discord群組。
魔法與戰鬥的世界---開發中的遊戲
這款遊戲發生在一個飄浮於雲端之上的世界，
這篇內容，簡單介紹了GameMaker的遊戲製作原理。包括Object、參數、程式碼等概念。同時也簡單介紹了GameMaker的適用範圍和特色。
Instrumect 是我從2022年10月開始製作的遊戲。
在那之前，其實嘗試過各種大大小小的遊戲開發，包括RPG、橫向射擊、2D平台遊戲等，但最後都熱情耗盡，所有項目皆斷尾(ゝ∀･)⌒☆
當初會選擇開發那些類型，不外乎考慮市場熱門程度和製作難易度。而最後會沒了熱情，是因為我對那類遊戲興趣沒很