Flutter 遊戲開發，不只是程式：如何從有想法到實現一款遊戲(一)
更新於 2023/03/01閱讀時間約 4 分鐘
前言
當今時代，遊戲已經不再只是單純的娛樂，更成為人們生活中不可或缺的一部分。隨著技術的發展，遊戲也從單機遊戲轉變成網路遊戲、手機遊戲、虛擬實境(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會員
9內容數
留言0
查看全部
你可能也想看
Google News 追蹤
*合作聲明與警語：
本文係由國泰世華銀行邀稿。
證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務，定期定額(股)服務由國泰綜合證券提供。
剛出社會的時候，很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天，都會聽到各種市場動態、理財話題，像是：聯準會降息或是近期哪些科
Flutter is a powerful, open-source UI software development kit created by Google.
解析成List
List items=json.decode(jsonStr);
print(items[0]["your_key"]);
解析成Map
Map<String, dynamic> user = json.decode(json);
print('${user['your_k
這邊會使用WebSocketChannel去與http://www.websocket.org做連線。
連線
final channel = IOWebSocketChannel.connect('wss://echo.websocket.events');
接收
StreamBui
Dio是一個Dart Http請求庫，支援Restful API、FormData、攔截器、請求取消、Cookie管理、檔案上傳/下載、逾時等。
加入
dependencies:
dio: ^x.x.x #请使用pub上的最新版本
使用
GET
Response response;
配置
idleTimeout：在httpClient請求結束後，會繼續保持連線，直到超過idleTimeout值才會關閉連接。
connectionTimeout：和伺服器建立連線逾時，如果超過connectionTimeout值則會拋出SocketException異常。
maxConnec
Introduction
Flutter is a powerful framework for developing the app for different platforms without redevelopment.
main.dart
route
routing map
msix
After comparing different methods, I think the most stable way is using msix to package the windows desktop app.
Installation
download
因為自己最近迷上了釣魚，但卻常常苦於不知道該去哪裡釣魚才能安全又有魚，因此想做個讓大家可以分享自己釣點以及釣況的App，讓大家都能找到適合自己的地方釣魚！
此篇是在介紹專案基本架構以及獲取使用者的地理位置。
如果你是剛入門Flutter的工程師，可以參考這篇文章，我會告訴大家自己常用的套件以及如何規劃檔案的分類！
*合作聲明與警語：
本文係由國泰世華銀行邀稿。
證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務，定期定額(股)服務由國泰綜合證券提供。
剛出社會的時候，很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天，都會聽到各種市場動態、理財話題，像是：聯準會降息或是近期哪些科
Flutter is a powerful, open-source UI software development kit created by Google.
解析成List
List items=json.decode(jsonStr);
print(items[0]["your_key"]);
解析成Map
Map<String, dynamic> user = json.decode(json);
print('${user['your_k
這邊會使用WebSocketChannel去與http://www.websocket.org做連線。
連線
final channel = IOWebSocketChannel.connect('wss://echo.websocket.events');
接收
StreamBui
Dio是一個Dart Http請求庫，支援Restful API、FormData、攔截器、請求取消、Cookie管理、檔案上傳/下載、逾時等。
加入
dependencies:
dio: ^x.x.x #请使用pub上的最新版本
使用
GET
Response response;
配置
idleTimeout：在httpClient請求結束後，會繼續保持連線，直到超過idleTimeout值才會關閉連接。
connectionTimeout：和伺服器建立連線逾時，如果超過connectionTimeout值則會拋出SocketException異常。
maxConnec
Introduction
Flutter is a powerful framework for developing the app for different platforms without redevelopment.
main.dart
route
routing map
msix
After comparing different methods, I think the most stable way is using msix to package the windows desktop app.
Installation
download
因為自己最近迷上了釣魚，但卻常常苦於不知道該去哪裡釣魚才能安全又有魚，因此想做個讓大家可以分享自己釣點以及釣況的App，讓大家都能找到適合自己的地方釣魚！
此篇是在介紹專案基本架構以及獲取使用者的地理位置。
如果你是剛入門Flutter的工程師，可以參考這篇文章，我會告訴大家自己常用的套件以及如何規劃檔案的分類！